（二十五）动态的添加路由

老怪兽

发布于 2023-02-22 18:46:54

51000

代码可运行

文章被收录于专栏：老怪兽的前端之旅老怪兽的前端之旅

运行总次数：0

代码可运行

动态的添加路由

说明

我们之前写的路由都是在 route.js 里面写的，这个是声明式的导航，他是静态的

一、编程式的添加和访问路由

// 这个和我们在文件中配置的路由是一样的
this.$router.addRoute({
    pathF: '',
    name: 'blogs',
    component: BlogListPage
})

二、编程式动态的删除路由

// 通过 name 删除路由
this.$touter.removeRoute('blogs')

// 如果添加的路由没有 name 属性，则可以通过 addRoute() 返回的实例来删除
const removeRote = this.$router.addRoute()
removeRoute()

三、查看添加的路由

console.log(this.$touter.getRoutes())

可以用来动态添加路由，页面内容可以使用 mackdown 来编写，也可以使用更高级的模板渲染引擎

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2022年11月14日，如有侵权请联系 cloudcommunity@tencent.com 删除

渲染

route

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

渲染

route

登录后参与评论

0 条评论

热度

（二十五）动态的添加路由

（二十五）动态的添加路由

动态的添加路由

一、编程式的添加和访问路由

二、编程式动态的删除路由

三、查看添加的路由

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐