Redux派发布尔值触发非可序列化值错误问题求助

你遇到的报错和布尔值本身无关，问题出在reducer的写法错误：

在Plannerstore.js里，你把createDialogOpen的reducer写成了嵌套箭头函数：

createDialogOpen: (state) => (value) => {
  state.createDialogOpen = value;
},

这种写法会让Redux把返回的内层函数存入状态中——而函数属于不可序列化的值，这才触发了A non-serializable value was detected in the state错误。

正确修改方式 #

把reducer改成Redux Toolkit要求的标准格式：接收state和action两个参数，通过action.payload获取派发来的布尔值：

修改后的Plannerstore.js：

import { createSlice } from "@reduxjs/toolkit";

export const plannerSlice = createSlice({
  name: "planner",
  initialState: {
    createDialogOpen: false,
  },
  reducers: {
    createDialogOpen: (state, action) => {
      state.createDialogOpen = action.payload;
    },
  },
});

export const { createDialogOpen } = plannerSlice.actions;

export default plannerSlice.reducer;

你的其他代码（Todo.js和Store.js）都没问题，修改后再派发布尔值就不会报错了。

内容的提问来源于stack exchange，提问作者Craws