Что такое flux

Flux — это архитектурный подход для управления состоянием в приложениях, предложенный Facebook. Он основан на однонаправленном потоке данных и включает четыре ключевых компонента:

1. Actions — события, которые передают данные в Dispatcher.
2. Dispatcher — центральный хаб, который распределяет Actions по Store.
3. Store — хранилища, содержащие состояние и логику его обновления.
4. View — компоненты, которые отображают данные и реагируют на изменения Store.

Пример:

// Action
const addTodo = (text) => ({
  type: 'ADD_TODO',
  payload: text,
});

// Dispatcher (обычно используется готовый, например, из библиотеки Flux)
Dispatcher.dispatch(addTodo('Learn Flux'));

// Store
class TodoStore {
  constructor() {
    this.todos = [];
    Dispatcher.register(this.handleAction.bind(this));
  }

  handleAction(action) {
    if (action.type === 'ADD_TODO') {
      this.todos.push(action.payload);
      this.emitChange();
    }
  }
}

Flux предшествовал Redux и вдохновил его создание. Главное отличие — в Flux может быть несколько Store, а в Redux — один.