首先,它搭配React组件,能够组织React组件结构代码,受权路由的控制。应该展现什么样的组件,经过React-Router去匹配它。react
首先,应该下载该npm包,这样引入项目工程里面,才能够引用react-router提供的API。git
//有两种方式 npm install --save react-router yarn add react-router
import {Router, Route, Switch } from 'react-router' // Router、Route、Switch各自作了什么事?
首先它们都是基于React.createElement构建,也就是JSX的组件的路由,至于Router、Route、Switch各自作了什么。去看官方文档,里面描述了每个组件路由作了什么事。能够去npm、也能够去github、也能够去官网去看。github
<Route>是React-router最重要的组件,路由最重要的职责就是渲染UI,但有一个条件location变量,要匹配route's路径。路径一匹配,传递进的组件就能够获得渲染。只要整个应用的location匹配了路由路径,你的组件就会渲染。npm
<Route />有三种方式去渲染传递进的组件。react-router
<Route component match location history /> <Route children /> <Route render /> <Route sensitive path="/one" component={Home} />
匹配location路径,渲染对应的组件,返回就是对象。code