React路由配置

目标

1.实现整个页面之间的跳转；
2.实现部分组件之间的切换；

安装react-router-dom

//控制台

cnpm install react-router-dom
//或者yarn add react-router-dom

创建配置文件

1.在src文件夹下创建routes文件夹，并创建index.js文件
2.编写路由目录
3.具体逻辑
1）import需要展示的页面和组件
2）对需要展示的页面进行分类，一部分是不需要验证可以看到的入mianRoutrs，包含登陆页、注册页和404；一部分是需要相应权限可以看到的，入后台管理页面；
3）对每个组件配置链接；必要参数：path和components

/src/routes/index.js

import Login from '../components/Login'
import Resigter from '../components/Resigter'
import Index from '../components/admin/dashboard/Index'
import List from '../components/admin/products/List'
import Edit from '../components/admin/products/Edit'
import PageNotFound from "../components/PageNotFound"
import {
    AlignLeftOutlined , PieChartOutlined} from '@ant-design/icons';

export const mainRoutes = [
    {
   path: '/login' , component: Login },
    {
   path: '/resigter' , component: