vue-router 使用 addRoute 给已注册的路由动态添加子路由
如何用addRoute实现子路由动态添加?前几天遇见过这个问题,记录一下我的解决方案。routers=[{path: "/",name: "layout",component: layout,meta: {},children: [{path: "/door",
·
如何用addRoute实现子路由动态添加?前几天遇见过这个问题,记录一下我的解决方案。
routers=[{
path: "/",
name: "layout",
component: layout,
meta: {
},
children: [
{
path: "/door",
name: "door",
redirect: "/door/homePage",
component: door,
meta: {
name: "首页",
},
},
]
}]
我要再children里面通过动态路由的方式添加一个子路由。
{ path: '/get', component: get};
使用this.$router.addRoute();
经过实践发现 addRoute 只能添加第一级的路由。
然后又想到把父级路和子级路由拼接好,全部都重新给覆盖一遍,这样确实解决了问题,但是会出现name重复的警告。
最后又去看了看文档,只要router.matcher属性做修改,即新的routes机会替换老的routers,其实就是replaceRoutes()的含义(官方没有提供这个api)
//替换以前的 router 保证名字不重复
router.matcher = new VueRouter({ mode: "hash" }).matcher
router.addRoute(routers)
这样就解决了动态给子路由添加新路由了。也不会出现name重复的警告了。
目前我就想到了这种解决方法,还有什么解决方法欢迎一起来交流啊!
更多推荐
已为社区贡献1条内容
所有评论(0)