介绍

React Router 是一个基于 React 之上的强大路由库，它可以让你向应用中快速地添加视图和数据流，同时保持页面与 URL 间的同步。

例子

https://github.com/xuya227939/blog/tree/master/examples/react-router/my-app

安装

$ sudo npm install -g create-react-app

$ create-react-app my-app

$ cd my-app

$ npm install react-router-dom

使用

1.引用的官方代码，在App.js插入以下代码

import React from 'react' import {  BrowserRouter as Router,  Route,  Link } from 'react-router-dom' const Home = () => (   Home ) const About = () => (   About ) const Topic = ({ match }) => (   {match.params.topicId} ) const Topics = ({ match }) => (   Topics    Rendering with React      Components      Props v. State      (  Please select a topic. )}/>  ) const BasicExample = () => (     Home About Topics       ) export default BasicExample

2.npm 启动

标签

• Link //类似a标签的跳转。
• Router //与 Route 一样都是 react 组件，它的 history 对象是整个路由系统的核心，它暴露了很多属性和方法在路由系统中使用;
• Route //path 属性表示路由组件所对应的路径，可以是绝对或相对路径，相对路径可继承;
• 4.0版本之后，history通过父组件传递进来，this.props.history.push（'/user'）;进行路由之间跳转
• 
  

问题处理

1.如果报类似这样的错，react-scripts 命令未找到 那么就 $ rm -rf node_modules 模块，重新安装下 $ npm i，再重新 npm start

欢迎在此issue下进行交流、学习

结语

使用react-router可以更方便的管理页面刷新、跳转。