如何修复"路由器不再默认历史道具哈希历史"警告？

Question

我正在使用浏览器历史记录,这是我在routes.js中的代码

 export default (
   <Router history={browserHistory}>
     <Route path="/" component={Main}>
       <Route path="home/:username" component={Home}>
         <IndexRoute component={HomeContent}></IndexRoute>
         <Route path="widget/:second" component={Widget}></Route>
         <Route path="email/:second" component={Email}>
           <Route path="compose" component={ComposeEmail}></Route>
           <IndexRoute component={CheckEmail}></IndexRoute>
         </Route>
         <Route path="social/:second" component={Social}></Route>
         <Route path="calendar/:second" component={Calendar}></Route>
       </Route>
       <IndexRoute component={Login}></IndexRoute>
     </Route>
   </Router>
 );

我使用this.context.router.push('/')进行导航.我不知道为什么这个警告会一直显示在我的控制台中？

 "Warning: [react-router] `Router` no longer defaults the history prop to hash history. Please use the `hashHistory` singleton instead."

我已经阅读了https://github.com/reactjs/react-router/blob/master/upgrade-guides/v2.0.0.md#no-default-history中的文档,但它并没有真正帮助.

我很感激任何帮助:)

Answer 1

您需要使用hashHistory而不是browserHistory. 考虑到您使用的是importsyntax，您可以hashHistory从中导入react-router来替换browserHistory.

import { hashHistory, Router, ... } from 'react-router';

const history = new hashHistory();

export default (
  <Router history={history}>
  ...
  </Router>
);