在后台管理的开发过程中,导航栏经常会遇到这样的需求,父级路由只是用来展示,没有组件,这样会存在一个问题,就是嵌套的子路由显示不出来,如何解决这个问题我这里记录一下:

export const children = [
    // 关于D3.js的使用
    {
      path:'/annotation',
      name:'annotation',
      component: {render: (e) => e("router-view")},
      meta:{
        title:"D3图标类"
      },
      children:[
        {
          path:'/chart1',
          name:'chart1',
          meta:{
            title:"柱形图"
          },
          component:() => import('@/views/annotations/chart1.vue'),
        },
        {
            path:'/chart2',
            name:'chart2',
            meta:{ 
              title:"圆形图"
            },
            component:() => import('@/views/annotations/chart2.vue'),
          },
      ]
    }
  ]

在父级路由的component加上{render: (e) => e(“router-view”)}即可显示正常

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐