2016-10-31 2 views
0

Я понимаю, что в React вы хотите постоянно сохранять свое состояние неизменным.Не могу понять, почему мой массив мутирует в моем редукторе

Возможно, есть несколько недостатков в моем логинном состоянии и неизменности. Исправьте меня, если я ошибаюсь, но ядро ​​объекта государства управляется в редукторах правильно? Значение, если я хочу, чтобы мой state из users (например) был списком ... Я хотел бы создать его в массив.

Следовательно, я установил inititalState = []. Вот где я считаю, что я в тупике. Я не знаю, правильно ли я это понимаю, или я не думаю.

Раньше я делал,

case GET_USERS: 
    return [...state, 
    Object.assign({}, action.payload) 
    ]; 

Но мне посоветовали изменить его return [...state, ...action.payload]; полагая, что это не объект или ключи я мутирует. В данный момент я предполагаю, что return [...state, ...action.payload]; заменяет state, с action.payload, НО ТО, ЧТО НЕ ДЕЛО ВСЕ.

Каждый раз, когда я пытаюсь и отфильтровать пользователь ... он просто мутирует и толкает объект пользователя в this.props.users и я смущен о том, что я стараюсь изо все сил следовать документациям Redux.

+1

Вы упомянули фильтрацию пользователей, но ваш код не показывает '.filter()' вы можете разместить соответствующий код? –

+0

Для фильтра я просто использую поисковый запрос. Это был всего лишь пример, но то, к чему я стремлюсь, это что-то вроде этого. 'this.getUsers (searchQuery) {this.props.getUsers (searchQuery) .bind (this))}'. Тогда все, что я делаю, это просто сопоставление 'this.props.users.map (....' – dsomel21

+0

Будет очень сложно определить проблему, с которой вы сталкиваетесь, не видя того, что вы уже пробовали с точки зрения фильтрации. ваш редуктор GET_USERS просто возвращает '[... state, ... action.payload]', тогда он будет продолжать добавлять 'action.payload' к' state' каждый раз, когда вызывается действие. ваш код. –

ответ

0

Это происходит потому, что ...state будет иметь ваш список users. Во время следующего вызова вы просто добавляете новых пользователей в state. Intead, вы должны вернуть payload.

Попробуйте следующее.

case GET_USERS: 
    return [...action.payload]; 
+0

Да, это сделал трюк. Должно быть, я сделал что-то глупое, как копировать и вставлять simil ар-редуктор, не задумываясь, полностью. Если мы хотим каждый раз возвращать новую копию обновляемого состояния ... тогда как возникают такие вещи, как '(... state, ... updatedState)'? Разве это не делает его изменчивым? – dsomel21

+0

Вы можете выполнить '[... state, ... updatedState]'. Проверьте [babel repl] (https://babeljs.io/repl/#?babili=false&evaluate=true&lineWrap=true&presets=latest&code=const%20a%20%3D%20%5B1%2C2%2C3%5D%0Aconst%20b% 20% 3D% 20% 5B4% 2C5% 2C6% 5D% 0Aconst% 20c% 20% 3D% 20% 5B ... A% 2C% 20 ... B% 5D% 0Aconsole.log (с)) –

Смежные вопросы