Pav*_*vel 5 javascript reactjs react-router redux
我正在尝试设置 Redux + React Router 应用程序。我认为问题出在 ImmutableJS 上,但我不明白如何解决它。
客户端.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();
Run Code Online (Sandbox Code Playgroud)
我收到此错误:
未捕获的类型错误:state.get 不是函数
在state这个对象中
我用"react": "^15.3.2","redux": "^3.6.0","react-router": "^3.0.0"
更新 1
我现在使用combineReducers来自redux-immutable:
import {combineReducers} from 'redux-immutable'
Run Code Online (Sandbox Code Playgroud)
但得到一个错误:
未捕获的类型错误:routingState.equals 不是函数
这里:
更新2
我修复了上述问题,但还有一个错误
我在此存储库中发布的所有代码
问题仍然存在src/index.js于route.js 的声明文件中require。
当您的require es6模块具有时default,您必须使用required 模块中的默认值。就像是,
const routes = require('./routes').default;
Run Code Online (Sandbox Code Playgroud)
这解决了您的问题,无需对 git 存储库进行任何其他更改。
| 归档时间: |
|
| 查看次数: |
656 次 |
| 最近记录: |