Лектор создал UI компонент для Button - https://i.imgur.com/IEVsVyX.png.
2. Он использовал его в другом компоненте - https://i.imgur.com/BtcQLd6.png.
3. Я понял, как это работает, но мне кажется, что это "какие-то не очень полезные дополнительные действия". Не проще ли было бы создать единый css файл, загрузить туда класс .button и просто присваивать его для кнопок? Это философский вопрос, просто вот не очень понимаю смысл.
Если бы ты делал это только через класс, то не смог бы переиспользовать функционал кнопки. Это и есть компонентный подход, то есть делить на компоненты и переиспользовать их в случае чего.
ну да, то есть, в Button компоненте может быть прописана бизнес-логика, которую не удается передать через css классы и поэтому мы используем компоненты, правильно понял?
Здесь дело не в классе, а в самом компоненте. Лектор вам пытался показать, минимальный модульный подход. К сожалению в данном примере он не добавил дополнительный функционал в этот компонент и для вас это выглядит, как обычная кнопка, которую вынесли в отдельный файл, но представьте, что эта кнопка будет по нажатию подгружать новые статьи или отправлять данные, для этого ее и выносят в отдельный файл, чтобы потом не дублировать эту логику.
Плюсую
понял, компонент включает как стили. так и логику. Можно переиспользовать такие компоненты, а не писать JS заново. Спасибо, разобрался.
Так же есть понятие модульных стилей. По факту те же стили, но их можно использовать как переменные. Их преимущество в том, что реакт на выходе вместо класса .button, напишет .button_h3gvd, где h3gvd является хэшем. Что даёт возможность делать одинаковые по названию классы, но разные по наполнению. И благодаря хэшу они в одном и том же компоненте не будут пересекаться.
На здоровье
да, эта тема будет раскрута на следующих уроках, спасибо за наводку
Обсуждают сегодня