me_edu
React: первое приложениеШаг 3 из 31 · 0% пройдено
Компоненты и JSX · Компоненты и JSX

Что такое компонент

AppHeaderHelloFooterДерево компонентов: родитель App собирает интерфейс из дочерних компонентов
Дерево компонентов: родитель App собирает интерфейс из дочерних компонентов

Интерфейс в React собирают из компонентов — это функции, которые возвращают разметку. Имя компонента всегда с большой буквы:

function Hello() { return <h1>Привет!</h1>; }

Компонент используют как HTML-тег:

<Hello />

Компоненты вкладывают друг в друга, собирая страницу как из кубиков:

function App() { return ( <div> <Header /> <Hello /> <Footer /> </div> ); }

Такой подход называют компонентным: один раз описали кнопку, карточку или меню — и переиспользуете везде. Это главное преимущество React: сложный интерфейс распадается на простые, независимые и переиспользуемые части.

Назад

Обсуждение

Войдите, чтобы участвовать в обсуждении.

Пока нет сообщений.