在状态中检测到不可序列化的值

Question

我在登录并转到仪表板时看到了这个错误。

它显示了这个错误在状态中检测到不可序列化的值，路径为：bugs.0。值：bug｛名称："加载时崩溃"，详细信息："3秒后崩溃"，步骤："打开应用程序，它将崩溃"，优先级：1，分配：未定义，…｝看看处理这种操作类型的reducer：bug/getBugs。

这是减速器：

/* eslint-disable no-unused-vars */
import {createSlice} from '@reduxjs/toolkit'
import {retrieveBugs} from '../bugController'
const slice = createSlice({
name:"bug",
initialState:[{}],
reducers:{
getBugs:(state) => retrieveBugs(),

createBugs: (state,actions) =>{
const {name,details,steps,priority,assaigned,creator,version,time} = actions.payload;
state.LoggedIn =true;
state.admin = true;
},
updateBug:(state,actions) => {
const {name,details,steps,priority,assaigned,creator,version,time} = actions.payload;
state.LoggedIn =true;
state.admin= true;

},
markComplete:(state,actions) => {
const {name,details,steps,priority,assaigned,creator,version,time} = actions.payload;
state.LoggedIn =true;
state.admin= true;
}
}
})
export default slice.reducer;
export const {getBugs, createBugs, updateBug, markComplete} = slice.actions;

这是错误控制器

import bugModel from '../Models/bugModel'
export function retrieveBugs(){
let data = [];
data.push(new bugModel({
name:"Crash on load",
details: "Crash after 3 seconds",
steps: "Open application and it will Crash",
assaigned: "Al Amzad",
creator: "John Doe",
priority: 1,
version: "V1.0",
time: "1:45",
}))

data.push(new bugModel({
name:"Wont load",
details: "Application doesn't load",
steps: "Open the Application it won't Load ",
assaigned: "Al Amzad",
creator: "John Doe",
priority: 3,
version: "V3.0",
time: "23:45",
}))
// eslint-disable-next-line no-unused-vars
let sorted = data.sort((a,b) => {return a.priority - b.priority})
return sorted;
}

Answer 1

Redux要求您仅将纯不可序列化的JS对象、数组和基元放入状态。

new bugModel将是一个类实例，因此不是一个普通的可序列化JS对象。因此，RTK专门发现了这个错误，并警告您不要这样做。

修复方法是切换到使用纯数据而不是类。