javascript – 忽略历史道具

我在React路由的在线课程中使用以下代码：

import { Router,Route,browserHistory } from 'react-router';

ReactDOM.render(
  browserHistory}>


它给了我一个跟随错误’react-router’不包含名为’browserHistory’的导出.
我做了一些研究,发现我使用的是React Router v4,上面的代码是针对v3的,所以我发现我应该使用< BrowserRouter>而不是< Router>所以我将我的代码更改为：

import { browserRouter,Switch } from 'react-router-dom';

ReactDOM.render(
   <browserRouter history={History}>

     browserRouter>,document.getElementById('root'));

历史我在一个单独的文件中：

import { createbrowserHistory } from 'history'

export default createbrowserHistory();

现在页面加载没有错误但是如果我使用Developer工具,我可以看到一个警告：

Warning: <browserRouter> ignores the history prop. To use a custom history,use `import { Router }` instead of `import { browserRouter as Router }`."

另一个问题是< Route path =“*”component =“NoMatch}>< / Route>只有当路由器中没有指定路径但是它加载到每个页面时才会加载NoMatch组件,无论如何.
任何人都可以帮助弄清楚如何解决问题？


最佳答案
我假设你正在使用react-router v4
首先,而不是< BrowserRouter>使用< Router>

import { Router } from 'react-router-dom';

您可以使用< withRouter>来访问历史对象的属性.正如Here所述
使用< withRouter>导出组件,就像是 ：

import React,{ Component } from 'react';
import { withRouter } from 'react-router-dom';

class SomeComponent extends Component {
render() {}
}
export default withRouter(SomeComponent);

其次,您可以使用< Switch>因为它呈现第一个孩子< Route>或<重定向>匹配位置
你可以包装一个< Switch>在< div>中像这样：

   

注意：上次路由没有path =“*”
您可以阅读有关< Switch>的更多信息.在ReactTraining Github年
如果您想了解更多有关React Router V4或< withRouter>的信息,请参阅,你可以阅读这个Medium Article


                
                                原文地址：https://www.jb51.cc/js/429243.html
                                 版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

javascript – 忽略历史道具

相关推荐