Чтобы понять как работает Redux тебе нужно норм вкуривать React.
Хотя бы для того, чтобы не пугаться props.
Есть у тебя React. Это все просто JS объекты.
<Component />
- так позволяет писать движок jsx, который и React его использует.
Так как структура компонентная, ты должен думать как обновить компоненты в в другой части страницы.
Принцип такой: компонент обычно обновляется при получении новых свойств - props или когда меняется его объект состояния - state.
Чтобы тебе обновить дальние друг от друга компоненты- тебе нужно продумать какие и где приходят свойства - чтобы пробросить функцию, которая вызовет перерисовку.
Что делает Redux:
Он не призывает отказываться от state.
Но есть общий контейнер данных. И когда данные меняются - меняются и компоненты, которые отображают именно эти данные.
Когда нужно что-то поменять - вызываешь
dispatch - специальная функция
reducer реагирует на это - и меняет данные как тебе нужно. Когда данные заменятся - компонент
Propvider - вызывает рендер у своего дочернего компонента (тот что оборачивает Provider).
Например:
<Provider>
<MyComponent />//Вот сюда Provider пробросит (запишет) новые props.
</Provider>
Записывает он это самое глобальное хранилище и все компоненты, для которых поменялись данные - перерисуются.
mapStateToProps - указывает какую часть этого глобального хранилища будет предоставлять provider.
Если у тебя оно такое:
{
chunkStore: {},
some: {}
}
То если mapStateToProps вернет
{store: store.chunkStore}
то Provider в props своего потомка пробросит такое:
store: store.chunkStore. И ты будешь обращаться внутри к store, но там будет только часть chunkStore (не весь объект, а его поле).
mapDispatchToProps - т.к. subscribe нет, то это возвращает функции, которые могут внутри себя вызывать
dispatch().
action - описывает то что и на что ты хочешь поменять. Какое поле и какие данные туда поместить.