如何在createSlice的reducer中获取状态值？

Question

我在我的React项目中使用redux-toolkit。在createSlice的简化器中，我要使用该状态下的现有实体数组，并在减小最终状态之前附加新数组。但是我无法获得状态值。

这是减速器代码

export const usersSlice = createSlice({
  name: "users",
  initialState: initialUsersState,
  reducers: {
    usersCreated: (state: UsersState, action) => {
      // in real, return count from the server and append the entities on front-end only?
      const { count, entities } = action.payload;
      const existingEntities = state.entities;
      const newEntities = [...existingEntities, ...entities];
      const totalCount = state.totalCount+count;
      return {
        ...state,
        entities: newEntities,
        totalCount: totalCount,
        listLoading: false,
        error: null,
      };
    },
}});

当我调试state.entites变量时，它看起来像这样

是否可以在reducer / extraReducer中访问当前状态值以根据需要重新创建状态？

因为我认为直接在reducer外部使用状态值将是一个不好的做法。如果我错了，请指导我。

修改

@Linda Paiste创建的code sandbox可以正常工作，这意味着我们可以访问reducer中的状态变量，但是我们无法调试该状态变量来更深入地了解该状态变量目前所持有的内容，因为Redux-toolkit以自己的方式处理状态... 从调试屏幕截图可以明显看出

Answer 1

您只能引用当前切片状态。

因此，您唯一的选择是将所需的entities作为动作的payload传递或将其实现为笨拙的createAsyncThunk并使用其API中的getState()。

Answer 2

总结自己和@karlmaxlopez的评论中的信息：

我将您的代码复制到CodeSandbox demo中，发现该代码确实可以执行。即使state.entities的值在检查时显示为state.entities或在登录时显示为Proxy，也可以像普通数组一样附加到null数组。

这是因为redux-toolkit使用Immer来防止您直接改变状态。在普通的redux reducer中，您会收到前一个state作为函数参数。作为用户，您有责任不对它进行突变，而是通过使用非突变方法（如对象散布，数组连接等）返回具有更新值的新对象。这就是您在{{ 1}}减速器，完全没问题。

但是redux-toolkit和Immer为编写reducer开辟了另一种可能性。在Immer reducer中，函数接收的usersCreated参数是“草稿”对象。这意味着您可以直接更改草稿对象而不会引起任何问题，因为它只是草稿，而不是真正的state。

这还意味着，当您尝试检查以前的状态时，它的行为会很奇怪，因为它只是草稿，而不是您期望的实际对象。

如果您想state草稿值，可以使用Redux工具包中包含的console.log函数调用console.log(current(value))来完成。 （根据@markerikson的评论编辑）。

至于检查每个操作对您的状态所做的更改，我建议使用Redux DevTools。我能够看到调度了哪些动作，当前状态，进行了哪些更改等。