Я новичок в Redux и хотел бы использовать его в своем приложении, но я застрял на этапе архитектуры/дизайна для части Redux. Вот мои требования и мои предположения относительно дизайна.
Сведения о приложении: SPA с AngularJS. Другие библиотеки использовали ng-redux, reselect, rxjs.
Сведения о компоненте. Многоразовый компонент сетки для визуализации огромных объемов данных.
Моя идея: создать архитектуру на основе компонентов типа plug-n-play, в которой все внутренние компоненты сетки не зависят от родительского/составного компонента, такого как поиск, сортировка, строка, заголовок, ячейка. .
Все компоненты будут иметь собственный набор редюсеров, действий, селекторов и срезов состояний из хранилища.
Поскольку все компоненты имеют свои редьюсеры и могут быть подключены по требованию, мне нужно, чтобы они лениво регистрировались в хранилище, а не накапливались в одном месте.
Некоторые компоненты, такие как поиск, сортировка, имеют собственное состояние и могут влиять на состояние других компонентов. Пример: настройка параметров запроса (searchText, sortOrder и т. д.) для получения данных сетки, которые будут обрабатываться другим компонентом (компонентами).
Мои мысли:
Во-первых, я изучаю reselect для предоставления зависимого фрагмента состояния.
Что касается второго пункта, я все еще не понимаю, что использовать combineReducers/replaceReducer для отложенной регистрации. Я чувствую, что combineReducers не подойдет, если мне нужен доступ к нескольким частям состояния.
Что касается третьего пункта, я думаю о следующих подходах:
а. Передача всего состояния через getState() везде, где требуется обновить несколько частей состояния. Хотя такой подход вызывает у меня ощущение неправильного использования Redux.
б. Компонент A запускает свое собственное действие, которое обновляет его часть состояния, затем запускается другое действие для другого компонента B, чтобы обновить свою часть состояния. Этот подход также кажется нарушением всей идеи Redux, здесь можно использовать концепцию побочного эффекта, хотя я не знаю, как ее использовать, возможно, redux-saga, redux-thunk и т. д.
ПРИМЕЧАНИЕ. Использование любого из подходов не должно приводить к тому, что компонент узнает о других компонентах, поэтому все, что нужно сделать, будет сделано путем передачи общего объекта конфигурации, такого как { actionsToFire: ['UPDATE_B'] }.
Мне нужно управление состоянием при переходе между страницами приложения, но мне не требуется горячая перезагрузка, повтор действий или предварительная выборка состояния приложения со стороны сервера.
Компоненты также будут нести ответственность за уничтожение своего состояния, когда оно больше не требуется. И состояние будет иметь нормализованную структуру.
Я знаю, что требования могут показаться странными или редко встречающимися, но я бы оставил их такими.
Я уже знаю несколько вещей:
Мне не нужно использовать Redux, как говорится в классической статье Дэна, но я думаю, что в данном случае он мне нужен.
Я знаю о компонентах Smart и Dumb, в основном мои компоненты могут показаться умными (т.е. осведомленными о состоянии приложения), но именно так я хочу их сохранить, я могу ошибаться.
Схема компонента сетки:
