路由问题与react路由器,redux,浏览器历史记录

时间:2016-03-22 05:20:00

标签: reactjs react-router redux browser-history

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页面。事实上,当我在网址中输入任何内容时,它总是会返回到应用页面。这是为什么?

0 个答案:

没有答案