Question

我尝试使用import { createStore as _createStore, applyMiddleware, compose } from 'redux'; import createMiddleware from './middleware/clientMiddleware'; import { routerMiddleware } from 'react-router-redux'; import {persistStore, autoRehydrate} from 'redux-persist'; export default function createStore(history, client, data) { // Sync dispatched route actions to the history const reduxRouterMiddleware = routerMiddleware(history); const middleware = [createMiddleware(client), reduxRouterMiddleware]; let finalCreateStore; if (__DEVELOPMENT__ && __CLIENT__ && __DEVTOOLS__) { const { persistState } = require('redux-devtools'); const DevTools = require('../containers/DevTools/DevTools'); finalCreateStore = compose( applyMiddleware(...middleware), window.devToolsExtension ? window.devToolsExtension() : DevTools.instrument(), persistState(window.location.href.match(/[?&]debug_session=([^&]+)\b/)) )(_createStore); } else { finalCreateStore = applyMiddleware(...middleware)(_createStore); } const reducer = require('./modules/reducer'); // const store = finalCreateStore(reducer, data); const store = finalCreateStore(reducer, data, autoRehydrate()); if (typeof window !== 'undefined') persistStore(store); if (__DEVELOPMENT__ && module.hot) { module.hot.accept('./modules/reducer', () => { store.replaceReducer(require('./modules/reducer')); }); } return store; }来保留数据。这是我的代码：

[1] redux-persist asyncLocalStorage requires a global localStorage object. Either use a different storage backend or if this is a universal redux application you probably should conditionally persist like so: https://gist.github.com/rt2zz/ac9eb396793f95ff3c3b
[1] Warning: React can't find the root component node for data-reactid value `.15mzo5h179c.3.0.0`. If you're seeing this message, it probably means that you've loaded two copies of React on the page. At this time, only a single copy of React can be loaded at a time.

单个流程可以正常工作。但如果我在除homePage之外的任何页面刷新页面，一切都会在页面上出现问题。我也收到了以下警告：

CREATE TABLE tbl_Students
(
    StudID INT
    ,StudName CHARACTER VARYING
    ,TotalMark INT
);

INSERT INTO tbl_Students 
VALUES 
(1,'Anvesh',88),(2,'Neevan',78)
,(3,'Roy',90),(4,'Mahi',88)
,(5,'Maria',81),(6,'Jenny',90);

P.S。我正在使用react-redux-universal-hot-example样板

Answer 1

只有在客户端上运行时，才想使用localStorage商店增强器有条件地创建商店。

...
const reducer = require('./modules/reducer');
let store;

if (__CLIENT__) {
    store = finalCreateStore(reducer, data, autoRehydrate());
    persistStore(store);
} else {
    store = finalCreateStore(reducer, data);
}
...

asyncLocalStorage需要全局localStorage对象

1 个答案: