Обновление магазина с помощью действий redux
Мне нужно обновить хранилище моего приложения с помощью редуктора. Но я хотел сделать его динамичным, чтобы мне не нужно было писать разные действия для обновления магазина на одном уровне.
Допустим, ниже мой магазин выглядит так ...
const store = { nonPersistedState : {first :"", second : "", third : ""} }
все первый, второй и третий находятся на одном уровне nonPersistedState.
Теперь для любого из трех вышеупомянутых, если я хочу их обновить, ниже приведены мои действия и функция редуктора.
//action
dispatch({type: "UPDATE_MODEL", value : true, model : "first"}); /*model can be second or third as well*/
//store
const initialState = {
first :"", second : "", third : ""
};
//reducer
const nonPersistedState = (state = initialState, action) => {
switch (action.type) {
case 'UPDATE_MODEL':
const localState = { ...state };
localState[action.model] = action.value;
return { ...localState };
default:
return state;
}
};
export default nonPersistedState;
Теперь здесь я сначала создаю копию состояния, а затем напрямую изменяю ее, а затем снова возвращаю копию состояния.
Итак, мой вопрос: мутирую ли я магазин или это нормально? Однако я не получаю никаких предупреждений или сообщений об ошибках в консоли, и формы перерисовываются. Пожалуйста, предоставьте материалы.
Ответы 1
То, как вы это делаете, правильно. Использование оператора распространения для создания нового состояния равно упоминается в документации Redux.
Однако вы можете немного уменьшить длину своего кода, назначив новое свойство напрямую одновременно с использованием оператора распространения. Это выглядело бы так:
const nonPersistedState = (state = initialState, action) => {
switch (action.type) {
case 'UPDATE_MODEL':
return {
...state,
[action.model] : action.value
};
default:
return state;
}
};