vue-router路由动态匹配
Sonder
2021-09-15
615字
2分钟
浏览 (3k)
动态路由可以通过router.addRoutes()
动态添加;
大概的实现思路是:
//路由拦截
router.beforeEach((to,from,next)=>{
//动态生成路由数据
addRoutes();
next();
});
function addRoutes(){
getNavData().then(res=>{ //请求路由数据
//生成路由数据
var data = routesData(res.data.result);
//动态添加
router.addRoutes(data);
})
}
//生成路由数据
function routesData(result){
result.forEach(item=>{
routes.push({
path: item.path,
name: item.name,
component: () => import('../views/'+item.component)
})
})
return routes
}
转载视频地址:https://www.zhihu.com/zvideo/1396424201645969408?playTime=389.5