码迷,mamicode.com
首页 > 其他好文 > 详细

React-router 4.0 history报错

时间:2017-05-26 16:03:12      阅读:428      评论:0      收藏:0      [点我收藏+]

标签:npm   pre   网站   自动   training   左右   row   github   提示符   

 

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>

 

React-router 4.0 history报错

标签:npm   pre   网站   自动   training   左右   row   github   提示符   

原文地址:http://www.cnblogs.com/zero7room/p/6908729.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!