VueCLI嵌套链接

93 阅读1分钟

配置的路由中以children在原本配置的路由内部添加嵌套

  {
    path: '/about',
    name: 'About',
    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue'),
    children: [
      {
        path:"a",
        component:Test
      },
      {
        path:"b",
        component:Test
      },
    ]
  },
    

页面中使用router-link跳转时需要加上父元素的name

<router-link to="/about/a">a页面</router-link> 

嵌套中component不能为父元素的name

最终效果如下:

image.png

image.png