Компонент (component) - это функция или класс, которая описывает, как элемент должен быть отображен на экране. Компоненты могут принимать свойства (props) и возвращать элементы. Компонент может содержать в себе другие компоненты, что позволяет создавать иерархию компонентов и элементов.
Контейнер (container) - это компонент, который используется для связывания компонентов с состоянием приложения. Контейнеры обычно содержат в себе бизнес-логику и обращаются к серверу для получения данных. Контейнеры используются для передачи данных от состояния приложения к дочерним компонентам.
| Компонент | Контейнер | |
|---|---|---|
| Цель | Как это выглядит (разметка и стили) | Как это работает (получение данных, обновление состояния) |
| Осведомлён о Redux | Нет | Да |
| Для считывания данных | Читает данные из props | Подписан на Redux state |
| Для изменения данных | Вызывает callback из props | Отправляет (dispatch) Redux действие (actions) |
| Пишутся | Вручную | Обычно, генерируются Redux |