一、概述
v6相比v5,做了很多的优化。包括书写上更加的便捷,更加体现组件化思想。以往在处理路由嵌套和鉴权方面,v5的写法都靠各自开发人员去实现相对比较参差不齐。一下针对v6的配置做简单的介绍。
二、useRoutes
v6中路由的设置采用hook的方式,有点像vue的router的实例化。
import {useRoutes} from "react-router-dom";
import { Suspense, lazy } from 'react'
const routes = [
{
path: '/',
auth:false,
component:lazy(() => import('./../page/login/Login'))
},
{
path: '/Portal',
auth:true,
component:lazy(() => import('../page/portal/Portal')),
children: [
{
path: '/Portal/Home',
auth:true,
component:lazy(() => import('../page/home/Home'))
},
{ path: '/Portal/Test/:id',
auth:true,
component:lazy(() => import('../page/test/Test'))
},
{
path: '/Portal/*',
auth:false,
comp