1.安装包
yarn add react-router-dom
2.新增router.js文件(src下,与App.js同级)
Router.js
import React from 'react';
import { BrowserRouter, HashRouter, Route, Link, Switch } from 'react-router-dom';
import App from './App.js';
const Router = () => (
<BrowserRouter>
<App/>
</BrowserRouter>
)
export default Router;
3.修改index.js
原App
修改成Router
即import Router from './Router';
<!-- <Router /> -->
4.App.js改成类组件
import { withRouter,NavLink,Switch,Redirect,Route} from 'react-router-dom';
<Switch>
<Route exact path="/" component={Home} />
</Switch>
5.新增加一个页面
三步
1、import 导入某个组件
2、自定义Url 目录
关联对应导入组件
3、新建组建文件夹
index.jsx