Однонаправленный поток данных и поток данных в Redux

Question 1

Однонаправленный поток данных и поток данных в Redux

Answer 1

Однонаправленный поток данных
1. state описывает состояние приложения в определенный момент времени;
2. пользовательский интерфейс (view) отображается на основе этого состояния (state);
3. когда что-то происходит (action) (например, нажитие на кнопку), обновляется состояние;
4. пользовательский интерфейс (view) перерисовывается на основе нового состояния.

Поток данных в Redux
Для Redux в частности мы можем разбить эти шаги на более детальные:

1. Исходная настройка:
   - Redux store вызывает функцию combineReducers один раз и сохраняет возвращаемое значение как свое исходное состояние;
   - Компоненты получают доступ к текущему состоянию Redux store и используют эти данные для первой отрисовки. Они также подписываются на обновления состояния хранилища, чтобы отслеживать изменения состояния.
2. Обновления:
   - В приложении происходит событие, например, пользователь нажимает кнопку;
   - Код приложения отправляет action в Redux store, например, dispatch({type: ‘counter/incremented’});
   - Redux store снова запускает функцию rootReducer с предыдущим состоянием (state) и текущим действием (action), сохраняя возвращаемое значение как новое состояние state;
   - Redux store уведомляет части пользовательского интерфейса, которые подписаны на обновления, об изменении состояния хранилища;
   - Компоненты пользовательского интерфейса, которые нуждаются в данных из хранилища, проверяют, изменились ли части состояния, которые им нужны;
   - Компоненты, обнаружившие изменение своих данных, перерисовываются с новыми данными.