美文网首页
Vue--动态路由

Vue--动态路由

作者: 蒜泥捣莓 | 来源:发表于2022-10-27 16:49 被阅读0次
router.addRouter的基础用法
静态路由
const routes = [
    {
        path: '/',
        name: 'Login',
        component: () => import(/* webpackChunkName: "about" */ '@/views/Login.vue')
    },
    {
        path: '/index',
        name: 'index',
        meta: { title: '首页', noCache: true },
        component: () => import(/* webpackChunkName: "about" */ '@/views/index.vue'),
        children:[]
        // children: [{
        //     path: '/test',
        //     name: 'test',
        //     component: () => import('../views/test.vue')
        // }
        // ]
    }
]
动态路由
const routeObj = {
    path: 'index/test', // 这里要把父路由的路径也带上
    name: 'test',
    meta: { title: '测试路由test', noCache: true },
    component: () =>
    import('../test/test.vue'),
}
//添加子路由只需把addRoute第一个参数填写父级路由的name
this.$router.addRoute('index', routeObj)

相关文章

  • Vue-- 监听路由变化,数据无法更新?

    Vue-- 监听路由变化,数据无法更新?

  • vue--路由

    实际生活中的应用界面,通常由多层嵌套的组件组合而成。例如: 借助vue-router,使用嵌套路由配置,就可以很简...

  • Vue 动态路由

    动态路由 动态路由传参

  • 动态路由 & 嵌套路由实例

    1.动态路由 注意:动态路由以‘:’开头。$route 参数表见 “ 动态路由 & 嵌套路由 ” 2.嵌套路由 注...

  • vue路由的介绍(二)--vue动态路由和get的传值

    vue动态路由和get的传值---->同属于路由的传参 1,vue动态路由: 动态路由的配置: ①,在配置路由时加...

  • 处理路由和权限映射element-admin

    你现在项目中如何处理路由和权限映射的? 动态路由分析动态路由流程图 动态路由源码分析生成动态路由的源码位于 src...

  • vue全家桶(2.5)

    3.8.动态路由匹配和路由组件传参 #3.8.1.动态路由匹配 动态路由意味着不固定,具有某种模式,我们希望通过某...

  • vue动态路由传值和get传值

    1、动态路由传值2、get传值 不同路由传值:动态路由 1、配置动态路由,main.js 2、在列表页NewsLi...

  • Vue常见面试题

    1.怎么定义vue-router的动态路由?怎么获取传递过来的动态参数? 何为动态路由?能够提供参数的路由即为动态...

  • vue中的路由

    vue中4中路由包含: 1、动态路由2、嵌套路由3、编程式路由4、命名式路由 1、动态路由 2、嵌套路由 3、编程...

网友评论

      本文标题:Vue--动态路由

      本文链接:https://www.haomeiwen.com/subject/nfdftdtx.html