Привет Хабр! Предлагаю вашему вниманию свободный перевод статьи «React Patterns» Майкла Чана, с некоторыми моими примечаниями и дополнениями.
Прежде всего хотел бы поблагодарить автора оригинального текста. В переводе я использовал понятие «Простой компонент» как обозначение Stateless Component aka Dump Component aka Component vs Container
Конструктивная критика, а так же альтернативные паттерны и фичи React приветствуются в комментах.
Оглавление
Поехали!
Прежде всего хотел бы поблагодарить автора оригинального текста. В переводе я использовал понятие «Простой компонент» как обозначение Stateless Component aka Dump Component aka Component vs Container
Конструктивная критика, а так же альтернативные паттерны и фичи React приветствуются в комментах.
Оглавление
- Простые компоненты — Stateless function
- JSX распределение атрибутов — JSX Spread Attributes
- Деструктуризация аргументов — Destructuring Arguments
- Условный рендеринг — Conditional Rendering
- Типы потомков — Children Types
- Массив как потомок — Array as children
- Функция как потомок — Function as children
- Функция в render — Render callback
- Проход по потомкам — Children pass-through
- Перенаправление компонента — Proxy component
- Стилизация компонентов — Style component
- Переключатель событий — Event switch
- Компонент-макет — Layout component
- Компонент-контейнер — Container component
- Компоненты высшего порядка — Higher-order component
Поехали!