切片在减速器中的状态自引用

Question

在使用 redux 的工具包更新切片的 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()with Redux 涉及传递一个空对象作为第一个参数以使其成为不可变的更新，例如Object.assign({}, oldItem, newItem).

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