redux - Slice 在 reducer 中的状态自引用

Question

在使用 redux 的工具包更新 slice 的 reducer 中的状态时，我遇到了循环引用的问题，例如：

const aSlice = createSlice({
...
extraReducers: builder => {
    ...,
    builder.addCase(addToState.fulfilled, (state, action) => {
        state.data = {
            ...state.data,
            ...action.payload.data
        };
    });
    ...,
  }

});

因此导致...state.data返回一个代理引用而不是返回的值，这是提到的陷阱之一，Redux Toolkit 文档以及Immer.js 的陷阱部分。

我可以想出一些方法来解决这个问题，但是，我想知道它们是否是解决这个问题的最佳实践或任何优雅的方式来完成这项工作？

Answer 1

使用 Immer 和代理时，“全部分配”的一个有用模式是实际使用Object.assign().

通常，Object.assign()与 Redux 一起使用涉及传递一个空对象作为第一个参数以使其成为不可变的更新，例如Object.assign({}, oldItem, newItem).

但是，使用 Immer，您可以进行真正的变异更新，将所有传入属性分配给现有对象。在这种情况下，Object.assign(state.data, action.payload.data)。