#javascript #reactjs #redux #react-redux #redux-thunk
Вопрос:
Я dispatch(action())
должен вызвать action
извне мой компонент реакции. Он работает правильно в том смысле, что запускает мое действие и обновляет новый элемент в моем store
. Проблема в том , что он, похоже, полностью сбрасывает все остальное в моем store
, что, по крайней мере, для меня делает его большей проблемой, чем его ценность.
Стоит отметить: я использую next.js
.
Вот основная идея моего потока:
У меня есть папка utils со службой, из которой я отправляю это действие:
import store from './store'; store.dispatch(myAction());
У меня есть свои действия
export const myAction = () =gt; ({ type: HELP_ME, payload: true, });
const initialState = { reducerVar: fase, otherExistingVar: {}, otherExistingVarTwo: null, otherExistingThree:null, otherExistingVarFour: false, }; const myReducer = (state = initialState, action) =gt; { switch (action.type) { case HELP_ME: { const reducerVar = action.payload; } default: { return state; } } }; export default myReducer;
Я не уверен, что злоупотребляю store.dispatch()
, потому что не понимаю, зачем кому-то использовать эту технику, если она полностью уничтожает существующие данные в хранилище. Или есть лучший способ запустить это простое действие извне моего компонента.
В принципе, я хочу выполнить dispatch
это действие, не полностью уничтожая свой магазин, точно так же, как я отправил бы действие, если бы я был в компоненте.
Спасибо!
Комментарии:
1. Как выглядит ваш редуктор? Как выглядит магазин?
Ответ №1:
вы должны вернуть состояние со значением в редукторе, как это.
const myReducer = (state = initialState, action) =gt; { switch (action.type) { case HELP_ME: { return {...state, reducerVar : action.payload} } default: { return state; } } };
Ответ №2:
То, что вы пытаетесь сделать, прекрасно. Но ваш редуктор должен вернуть все состояние с вашим изменением, выполненным действием, как показано ниже.
const myReducer = (state = initialState, action) =gt; { switch (action.type) { case HELP_ME: const reducerVar = action.payload; return {...state, reducerVar } default: return state; } };