Почему не обновляется props после unshift и dispatch?

Question

[vaskadogana]

есть такой код,

.then(function answer(answer){
        	let clients_info = answer.data;
        	<b>currentList.unshift(clients_info);</b>
        	store.dispatch({
        		type: 'GET_clients',
        		setAdminData: currentList
			})
    })

store обновляется однако рендера не происходит. (новые пропсы неприходят)
Если ставлю переменную без unshift, то рендер происходит.
например вот так

.then(function answer(answer){
        	let <b>clients_info</b> = answer.data;
        	currentList.unshift(clients_info);

        	store.dispatch({
        		type: 'GET_clients',
        		setAdminData: clients_info
			})
    })

Отсюда делаю вывод, что проблема не в конектах и т.п. А в массиве который возвращается из этой строки
currentList.unshift(clients_info);
визуально массив стал на элемент больше. Взял текущее состояние, добавил в начало массива элемент. сделал диспатч нового массива. Однако рендера не происходит.
Кто нибудь сталкивался?

Answer 1

[Максим]

Взял текущее состояние, добавил в начало массива элемент. сделал диспатч нового массива.

Здесь кроется главная ошибка, вы "сделали диспатч", того же самого массива. Почему он стал новым? Не правда.

Т.е. вы возвращаете тот же самый объект (в js объекты передаются по ссылке), для react вьюхи ничего не изменилось, значит render вызывать не надо => ничего не происходит.

Попробуйте возвращать новый(!) массив, в вашем случае это:
setAdminData: [clients_info, ...currentList]

Либо чуточку понятнее, но вставляя в конец массива:
setAdminData: currentList.concat(clients_info)

Метод concat всегда возвращает новый массив.

Ну и чтобы стало совсем понятно в чем дело, попробуйте в консоли выполнить следующий код:

let arr1 = [1,2,3,4]
let arr2 = arr1
arr2.unshift(1)
console.log(arr1)

Вопросы: чему равен arr1? Почему? Будет ли arr1 === arr2, почему?
Еще вопросы: В каком случае react вызывает функцию render?

Comments

[vaskadogana]

спасибо, тоже пришел к concat, но этой штуки с массивами всё равно не понял.
а если я хочу скопировать массив, как тогда быть?

[vaskadogana]

let arr1 = [1,2,3,4];
let arr2 = arr1;
arr2.unshift(1);
let answer;
if (arr2 === arr1){
answer = true;
}else {answer = false}

console.log(answer);

возвращает Uncaught SyntaxError: Identifier 'arr1' has already been declared

[Максим]

vaskadogana take.ms/MVBA8 - никаких ошибок нет. Если по поводу массивов так и не уложились, то значит пора читать теорию: https://learn.javascript.ru/object-reference

[Андрей]

Максим: а почему надо возвращать именно новый обьект, как я понимаю это все сделано для скорости проверки состояния, изменилось оно или нет, тоесть не надо смотреть в каждое поле обьекта на то другое ли там значенине, а просто сравнить новый ли это обьект, я правильно понимаю?

[Максим]

undefined_title: в вашей постановке вопроса - правильно. Так как создатели redux могли бы "заходить в объекты на все уровни и сверять по каждому полю", но не стали. И правильно сделали)