持久化登录时控制台报错

来源:11-10 【登录页面】SignOut登出业务处理

weixin_慕圣2405694

2021-08-14

写redux-persist的时候报控制台报(index.js:1 A non-serializable value was detected in an action, in the path: register. Value: ƒ register(key) {
pStore.dispatch({
type: constants__WEBPACK_IMPORTED_MODULE_1
[“REGISTER”],
key: key
});
}
Take a look at the logic that dispatched this action: {type: ‘persist/PERSIST’, register: ƒ, rehydrate: ƒ}
(See https://redux.js.org/faq/actions#why-should-type-be-a-string-or-at-least-serializable-why-should-my-action-types-be-constants)
(To allow non-serializable values see: https://redux-toolkit.js.org/usage/usage-guide#working-with-non-serializable-data))但程序运行没问题,登录后发现localstorage存储的是【login: “{“loading”:false,“error”:null,“token”:“eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJkZWQ0NWI0Yi02M2ZkLTRlNDQtOWE1NC1lZDFkOTVmZjdlMWIiLCJ1c2VybmFtZSI6ImFsZXgxMjM0QDE2My5jb20iLCJuYmYiOjE2Mjg5MTkyMTEsImV4cCI6MTYyOTAwNTYxMSwiaXNzIjoiZmFrZXhpZWNoZW5nLmNvbSIsImF1ZCI6ImZha2V4aWVjaGVuZy5jb20ifQ.ERfvue1RoKYAaqsBcfr6eeUPke38cwsx5wPZf2VCVwE”}”
_persist: “{“version”:-1,“rehydrated”:true}”】这种格式数据,
下面是store中我写的代码

import { combineReducers, configureStore } from “@reduxjs/toolkit”;
import Detaildata from “./detaildata/Detaildata”;
import HomeData from “./homedata/HomeData”;
import Login from “./login/Login”;
import SearchData from “./searchdata/SearchData”;
import { persistReducer, persistStore } from “redux-persist”;
import storage from “redux-persist/lib/storage”;
const persistConfig = { key: “root”, storage, whitelist: [“login”] };

const rootReducer = combineReducers({
homepage: HomeData,
detaildata: Detaildata,
searchdata: SearchData,
login: Login,
});
const persistedReducer=persistReducer(persistConfig,rootReducer)
const store=configureStore({
reducer: persistedReducer,
});
const persistor=persistStore(store)
export default {store,persistor}

写回答

1回答

阿莱克斯刘

2021-08-17

这个问题是因为 Redux Toolkit 的中间件会深度检查状态树, 一旦检测到非序列化的数据则会报错。

具体的问题解答请看11-2的置顶回复:

http://coding.imooc.com/learn/questiondetail/9eAQxX2y1kqY0BjG.html

0
1
weixin_慕圣2405694
谢谢老师
2021-08-25
共1条回复

React 18 系统精讲 结合TS打造旅游电商平台

React 18 精讲 + 结合 TS 实战 + 热门业务开发,获取必备技能

2042 学习 · 1035 问题

查看课程