问题描述
使用 nextjs 框架,redux-persist 不会创建本地存储值.登录后,persist:root 没有显示在本地
using the nextjs framework the redux-persist is not creating the local storage values. After login the persist:root is not showing in the local
在reactjs框架中,我尝试了redux持久化在本地存储中创建的persist:root,但在nextjs框架中使用相同的方法,我遵循的错误没有出现,但persist:root没有显示
在本地存储
In the reactjs framework, I have tried the redux persist the persist:root created in the local storage but in the nextjs framework the same method I am following the errors not coming but the persist:root is not showing
in the local storage
//store.js
//store.js
import { createStore, applyMiddleware, compose } from 'redux';
import thunk from 'redux-thunk';
import reducers from './reducers';
import { persistReducer } from 'redux-persist';
import nextConnectRedux from 'next-connect-redux';
import storage from 'redux-persist/lib/storage/session';
const persistConfig = {
key: "root",
storage: storage,
}
const persistedReducer = persistReducer(persistConfig, reducers)
const middleware = [thunk];
const composeEnhancers =
typeof window !== 'undefined' &&
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ?
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
}) : compose;
const enhancer = composeEnhancers(
applyMiddleware(...middleware),
);
const store = () => {
return createStore(
persistedReducer,
{},
enhancer
)};
const nextConnect = nextConnectRedux(store)
export default nextConnect;
//index.js
// index.js
import React, { Component } from 'react';
import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/integration/react';
import { persistStore } from 'redux-persist';
import nextConnect from '../store';
import Route from '../routes';
import { BrowserRouter } from "react-router-dom";
class App extends Component {
render () {
const persistor = persistStore(nextConnect);
return (
<Provider store={nextConnect}>
<PersistGate loading={null} persistor={persistor}>
<BrowserRouter>
<Route/>
</BrowserRouter>
</PersistGate>
</Provider>
)
}
}
export default App;
我希望显示本地存储中的persist:root
I want the persist:root in the local storage to be showed
推荐答案
如果你在服务器上渲染 React,你不能在默认配置中使用 redux-persist当您在默认配置下使用 redux-persist 时,意味着您将数据存储在浏览器存储中,而服务器上没有浏览器下面的实现展示了如何将 Redux Persist 集成到 Next.js
if you are rendering React on the server, you cant use redux-persist with default configsWhen you are using redux-persist with the default configuration, means you are storing your data on browser storage and you don’t have a browser on the serverThe following implementation shows you how to integrate Redux Persist into Next.js
rootReducer.js
store.js
_app.js
就这样
这篇关于redux 在下一个js项目中持久化persist:root没有创建localstorage的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!