如何替换 Redux Toolkit reducer 中的整个状态？

Question

编辑：解决方案是 return state 完全替换后 (return state = {...action.payload})！但为什么？当我单独替换字段时，我不需要 return 它。

我正在使用 Redux Toolkit，它简化了一些 Redux 样板文件。他们做的一件事是使用 Immer 让你直接进入 'modify' 状态（事实上，你不是）。它工作正常，除了我不知道如何完全替换我的状态部分。例如，我想做这样的事情

const reducer = createReducer({ s: '', blip: [] }, {

    [postsBogus.type]: (state, action) => {
        state = { ...action.payload };
    }

但 state 保持不变。相反，我必须这样做

[postsBogus.type]: (state, action) => {
    state.s = action.payload.s;
    state.blip = action.payload.blip;
}

有没有办法完全替换状态？

Answer 1

是的，如您所述，您必须 return 一个新值才能完全替换状态。

即使在“普通”Redux reducer 中，分配 state = newValue 也没有任何作用，因为所做的只是说 局部函数变量 命名为 state现在指向内存中的不同值。这对 return 一个新值没有任何作用。

对于 Immer，you can either mutate the contents of the Proxy-wrapped state value as long as it's an object or array, or you can return an entirely new value, but not both at once。

Answer 2

你可以，但不是这样，当你说：

function x(y){
   y = 4
}

你正在改变函数参数，而不是 redux 的状态，你有两个选项来更新你的 redux store 的这个状态：

要么设置 state.your_state_name = something 或者，在你的情况下，你想要做的是 return 一个新对象，新对象是什么新的状态值将是。

简单示例：

myReducerFunc: (state, action) => {
  return {...action.payload }
},

另一个例子：

const loggedInUserSlice = createSlice({
  name: '$loggedInUser',
  initialState: {
    isLoggedIn: false,
  },
  reducers: {
    loggedIn: (state, action) => {
      return {
        isLoggedIn: true,
        ...action.payload,
      }
    },
  },
})

如何替换 Redux Toolkit reducer 中的整个状态？

How can you replace entire state in Redux Toolkit reducer?

reactjs

redux

react-redux

immer.js