React-router 4.0 history报错

react-router 更新到了4.0,很多API已经不一样了。history 被纳入了 react-router-dom 文件下的 HashRouter、BrowserRouter等。使用4.0版到react-router网站了解下新API,或者仍想按原来方式,可以安装旧版的react-router。

这两天准备用react写个新项目,自动拉取的 React-router 版本是4.1.1的版本;接下来用以前的写法就各种出不来,网上查了一下相关答案很少之后就想是不是版本的问题,果然新版本跟以前的用法稍微有点不一样的;

废话不说了 2.8 左右的版本是 稳定的,4.1.1是最近的新版本了;

2.8左右的版本的使用可以参照阮一峰的:

http://www.ruanyifeng.com/blog/2016/05/react_router.html?utm_source=tool.lu

React-router的官方地址:

https://reacttraining.com/react-router/

https://reacttraining.cn/

好直接上个例子,本文用 react 官方脚手架 create-react-app

前置条件可以参照:http://blog.csdn.net/github_38095237/article/details/68491408

里边有nodejs 与 npm 的相关配置

打开命令提示符输入

npm install react-router 
npm install react-router-dom
import React from 'react'
import {BrowserRouter as Router,Route,Link} from 'react-router-dom'//导入的方式跟之前有点变化
<Router> <div> <Link to="/">首页</Link> <br/> <Link to="/two">第二页</Link> <br/> <Link to="/Lists">一个列表</Link> <br/> <Route exact path="/" component={One}/> <Route path="/two" component={Two}/> <Route path="/Lists" component={List}/> </div> </Router>