vue router children 不正常显示问题

最新推荐文章于 2023-07-16 18:48:20 发布

脑瓜不疼

最新推荐文章于 2023-07-16 18:48:20 发布

阅读量4.5k

点赞数 6

分类专栏：大前端文章标签： vue.js

本文链接：https://blog.csdn.net/super__code/article/details/108736988

版权

大前端专栏收录该内容

88 篇文章 0 订阅

订阅专栏

 {
    path: '/home',
    component: () => import('../views/home/home.vue'),
    children: [
      {
        path: '',
        name: 'home',
        component: () => import('../views/home/home.vue'),
      },
      {
        path: 'sub',
        name: 'homeSub',
        component: () => import('../views/home/subpage.vue')
      }
    ]
  },

问题描述：

在项目中使用路由父子是嵌套时，路由不显示页面问题，

解决方法：

1、在父路由得对象里里写入

component: {render: (e) => e("router-view")},

2、父页面的在vue页面中加入

  <router-view />

在这里插入图片描述

路由代码：

 {
    path: '/home',
    component: {render: (e) => e("router-view")},
    children: [
      {
        path: '',
        name: 'home',
        component: () => import('../views/home/home.vue'),
      },
      {
        path: 'sub',
        name: 'homeSub',
        component: () => import('../views/home/subpage.vue')
      }
    ]
  },