动态加载路由有几种方案
- 前端自己根据不同的用户设置对应的路由表
- 后端哥哥们给设置好路由表,前端请求接口拿到路由表
本文采用的是第一种方法
大概的思路:
- 设置不同的路由表
- 将用户注册的一部分信息存储到vux
- 根据用户的不同身份 在跟组件created时以及登陆请求成功时,都将不同的路由表添加到当前路由表中;;第一种是为了防止用户点击刷新而造成路由初始化;;第二种就是登陆成功后立马准备好对应的路由表
注: 404路由写在动态路由中,否则可能会有闪屏和路由为空时加载的404页面(没有亲测,看其他人说的)
1.设置路由表
//管理者路由
export const ManagerRouter = [
{
path: "/index",
component: Index,
children: [
{
path: "/infolist",
name: "InfoList",
component: InfoList
},
{
path: "/fundlist",
name: "FundLst",
component: FundList
}
]
},
];
//公共路由
const PublicRouter = [
{
path: "/index",
component: Index,
children: [
{
path: "",
component: Home
},