[英]React Redux router error
我正在嘗試設置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();
我收到此錯誤:
未捕獲的TypeError:state.get不是函數
在state
這個對象
我使用"react": "^15.3.2"
, "redux": "^3.6.0"
, "react-router": "^3.0.0"
更新1我現在使用redux-immutable
combineReducers
:
import {combineReducers} from 'redux-immutable'
但得到一個錯誤:
未捕獲的TypeError:routingState.equals不是函數
這里:
更新2
我修正了上面的問題,但還有一個錯誤
我在此存儲庫中發布的所有代碼
問題保留在帶有route.js的require
語句的src/index.js
文件中。
當您require
具有default
es6
模塊時,您必須使用require
d模塊的默認值。 就像是,
const routes = require('./routes').default;
這解決了你的問題,而你的git倉庫沒有任何其他變化。
您正在使用的combineReducers
不使用immutable
。 通過設置fromJS(blah)
而不是你所在州的最高級別,每個分支都是immutable
的。 使用redux-immutable
代替:
import {combineReducers} from 'redux-immutable';
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.