KnightForce

Ну для приличия в цикле глянь что у тебя выводит.
Пишет что у null нет такого свойства - это значит, что у тебя где-то так переменная.checked. А переменная равна null.

И где у тебя arrRefs обновляется данными? Ты же его только в конструкторе объявил и все.

Чувак выше прав, но можешь оставить так:

{
 oneListOfObjects:[],
 twoListOfObjects:[],
 threeListOfObjects:[],
}

А потом, например в constructor App (или что там у тебя оборачивает Provider) вызови запрос к серверу. Тут уж как хочешь. Например, если нужно переписать на React, а сервер не переписывать.

initState - это начальный store ля твоего проекта.
Ты можешь использовать один редьюсер и в нем обращаться к определенным полям store, но чтобы было проще - их расщепляют. В итоге каждый reducer работает со своим полем из store.

Я короче, не читал.
Кратко
Чтобы подписать используй библиотеку react-redux. Она за кулисами подпишет. В итоге:

export default connect(mapStateToProps, mapDispatchToProps)(App);

connect - присоединяет хранилище.
mapStateToProps - выделяет часть или весь state. Может ты хочешь выдать только одно какое-то поле.
mapDispatchToProps - все что здесь вернется - и будет диспатчить.

Пример:

function mapDispatchToProps(dispatch) {
	return {
		downloadTickets: ()=>{
			dispatch(actions.downloadTickets);
		},
		setSelectValues: (value)=>{
			dispatch(actions.setSelectValues(value));
		},
		setActvePage: (value)=>{
			dispatch(actions.setActvePage(value));
		},
	};
}

export default connect(mapStateToProps, mapDispatchToProps)(App);

В mapDispatchToProps под капотом передается dispatch, все что вернется из этой функции будет доступно в props.
props.downloadTickets

Используя thunk.
А внутри можно использовать колбэки.

document.body.sccrollTop=0;

Чтобы получить элемент - используй ref :
<div ref={(elemDOM)=>{this.newEl=ElemDOM}}/>

Так получаешь - потом делаешь что хочешь.)

setTimeout(()=>{
    //Код - контекст привязал через стрелочную функцию
}, 5000)

Есть форма и ее компоненты - собирай все изменения в state формы, а потом весь пул диспатч.
Потомки могут менять state родителя, если передать функцию.

Абстрактно: У тебя есть 1 узел слева на вложенности 500 узлов, 2 узел на вложенности 1000 и третий на 700, все в 3 разных направления и необходим, чтобы они работали синхронно от данных. И вот тут у тебя есть единый контейнер от которого и получаешь данные. А чтобы не передавать через цепочку props - используй контекст.

А также гарантия что все синхронно обновится. Везде доступны одни и те же данные.
Не нужно выстраивать цепочку обновлений через изменение родительского state.

Про контекст:
https://habrahabr.ru/post/266407/

Теперь сам использую пробрасывая данные и функции для диспатча.

Попробуй PureComponent.
А в целом, обновляется только то где изменились данные, если только ты не пишешь при получении в state.

В редьюсере.

От ситуации зависит.
Был компонент, который зависел от своих же данных - использовал state.
Но потом понадобилось добавить второй и чтобы они были синхронизированы - вот тут пришлось использовать store приложения.

Чтобы понять как работает 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 - описывает то что и на что ты хочешь поменять. Какое поле и какие данные туда поместить.