import 'babel-polyfill'
import React from 'react'
import ReactDOM from 'react-dom'
import { createStore, applyMiddleware } from 'redux'
import { Provider } from 'react-redux'
import thunk from 'redux-thunk'
import createLogger from 'redux-logger'
import devTools from 'remote-redux-devtools'
import { Route, Router, browserHistory } from 'react-router'
import { syncHistoryWithStore, routerReducer } from 'react-router-redux'
import App from './components/App'
import getRoutes from './routes'
import reducers from './reducers/index'
import * as storage from 'redux-storage'
import createEngine from 'redux-storage-engine-localstorage'
require('./stylesheets/main.scss');
const reducer = storage.reducer(reducers);
const engine = createEngine('my-save-key');
const storageMiddleware = storage.createMiddleware(engine, ['LOGOUT', '@@router/LOCATION_CHANGE']);
const logger = createLogger({collapsed: true})
const createStoreWithMiddleware = applyMiddleware(thunk, storageMiddleware, logger)(createStore)
const store = createStoreWithMiddleware(reducer);
const load = storage.createLoader(engine);
const history = syncHistoryWithStore(browserHistory, store);
console.log('loading store');
load(store)
.then( () => {
console.log('store is done loading')
ReactDOM.render(
<div>
<Provider store = {store}>
<Router history={history}>
<Route path='/' component={App}>
<Route path='profile/:username' component={User}/>
</Route>
</Router>
</Provider>
</div>,
document.getElementById('app')
);
})
在我的服务器上,我有这个来处理请求:
app.get('*', function (request, response){
response.sendFile('index.html', {"root": "public"})
})
上面是我的应用程序的主页面,我的react-router所在的位置。我将它同步到redux商店。
问题在于:我可以从App
导航到User
页面。当我刷新页面时,我希望保留在用户页面上,而是回到App页面。事实上,当我在网址中输入任何内容时,它总是会返回到应用页面。这是为什么?