我想导航到路径/hello
并尝试以下操作:
import { browserHistory } from 'react-router'
browserHistory.push('/hello')
但它只会将浏览器的网址更改为/hello
,而不会实际导航到该网页。在组件内部,此方法有效:
this.props.history.push('/hello')
这就是我设置路由器的方式:
// Configure history for react-router
const browserHistory = useRouterHistory(createBrowserHistory)({
basename: __BASENAME__
})
// Create redux store and sync with react-router-redux. We have installed the
// react-router-redux reducer under the key "router" in src/routes/index.js,
// so we need to provide a custom `selectLocationState` to inform
// react-router-redux of its location.
const initialState = window.__INITIAL_STATE__
const store = configureStore(initialState, browserHistory)
const history = syncHistoryWithStore(browserHistory, store, {
selectLocationState: (state) => state.router
})
// Now that we have the Redux store, we can create our routes. We provide
// the store to the route definitions so that routes have access to it for
// hooks such as `onEnter`.
const routes = makeRoutes(store)
// Now that redux and react-router have been configured, we can render the
// React application to the DOM!
ReactDOM.render(
<Root history={history} routes={routes} store={store} />,
document.getElementById('root')
)
参考文献:
答案 0 :(得分:2)
当我设置browserHistory
时,我将其存储在全局命名空间中:
const history = syncHistoryWithStore(browserHistory, store, {
selectLocationState: (state) => state.router
})
window.routerHistory = history
然后我可以在下面的组件之外导航:
window.routerHistory.push('/')