React Redux 路由器错误
我正在尝试设置一个 Redux + React Router 应用程序。我认为问题出在 ImmutableJS 上,但我不知道如何解决它。
client.js
import { fromJS } from 'immutable'
import React from 'react'
import { render, unmountComponentAtNode } from 'react-dom'
import { AppContainer } from 'react-hot-loader'
import { Provider } from 'react-redux'
import { match, Router, browserHistory } from 'react-router'
import { syncHistoryWithStore } from 'react-router-redux'
import { createStore, combineReducers, compose, applyMiddleware } from 'redux'
import { routerReducer, routerMiddleware } from 'react-router-redux'
function createSelectLocationState(reducerName) {
let prevRoutingState;
let prevRoutingStateJS;
return (state) => {
const routingState = state.get(reducerName); // or state.routing
if (!routingState.equals(prevRoutingState)) {
prevRoutingState = routingState;
prevRoutingStateJS = routingState.toJS();
}
return prevRoutingStateJS;
};
}
function configureStore(history, initialState) {
const reducer = combineReducers({
routing: routerReducer
});
return createStore(
reducer,
initialState,
compose(
applyMiddleware(
routerMiddleware(history)
)
)
);
}
const initialState = fromJS(window.__INITIAL_STATE__);
const store = configureStore(browserHistory, initialState);
const history = syncHistoryWithStore(browserHistory, store, {
selectLocationState: createSelectLocationState('routing')
});
const rootNode = document.getElementById('root');
const renderApp = () => {
const routes = require('./routes');
match({ history, routes }, (error, redirectLocation, renderProps) => {
render(
<AppContainer>
<Provider store={store}>
<Router {...renderProps} />
</Provider>
</AppContainer>,
rootNode
);
});
};
// Enable hot reload by react-hot-loader
if (module.hot) {
const reRenderApp = () => {
try {
renderApp();
} catch (error) {
const RedBox = require('redbox-react').default;
render(<RedBox error={error} />, rootNode);
}
};
module.hot.accept('./routes', () => {
setImmediate(() => {
// Preventing the hot reloading error from react-router
unmountComponentAtNode(rootNode);
reRenderApp();
});
});
}
renderApp();
我收到此错误:
Uncaught TypeError: state.get is not a function
在
state
此对象中
我使用
“react”: "^15.3.2"
,
"redux": "^3.6.0"
,
"react-router": "^3.0.0"
更新 1
我现在使用
redux-immutable
中的
combineReducers
:
import {combineReducers} from 'redux-immutable'
但出现错误:
Uncaught TypeError: routingState.equals is not a function
这里:
更新 2
我修复了上述问题,但还有一个错误
我发布的所有代码都在 这个 存储库中
问题出在
src/index.js
文件中,其中包含 route.js 的
require
语句。
当您
require
具有
default
的
es6
模块时,您必须使用
require
模块中的默认值。类似
const routes = require('./routes').default;
这解决了您的问题,而无需对您的 git 存储库进行任何其他更改。
您使用的
combineReducers
未使用
immutable
。通过设置
fromJS(blah)
,每个分支都是
immutable
,但不是在状态的最高级别。请改用
redux-immutable
:
import {combineReducers} from 'redux-immutable';