问题描述

使用了3层嵌套的路由，在页面不能显示出来。
访问http://localhost:9527/#/foodMan/foodMainInfo/mainInfoSearch在页面空白显示

问题出现的环境背景及自己尝试过哪些方法

具体的文件路径都是对的，也存在相应的文件

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）
vue-router:
{

path: '/foodMan',
component: Layout,
hidden: false,
name: '商品管理',
children: [
  {
    path: 'foodMainInfo',
    name: '商品主信息',
    meta: { title: '商品主信息', icon: 'icon', noCache: true },
    //component: () => import('@/views/foodMan/foodMainInfo/mainInfoSearch/index'),
    children: [
      {
        path: 'mainInfoSearch',
        component: () => import('@/views/foodMan/foodMainInfo/mainInfoSearch/index'),
        name: '商品主信息查询',
        meta: { title: '商品主信息查询', icon: 'icon', noCache: true }
      }, 
      {
        path: 'mainInfoKeep',
        component: () => import('@/views/foodMan/foodMainInfo/mainInfoKeep/index'),
        name: '商品主信息维护',
        meta: { title: '商品主信息维护', icon: 'icon', noCache: true }
      }, 
      {
        path: 'mainInfoAdd',
        component: () => import('@/views/foodMan/foodMainInfo/mainInfoAdd/index'),
        name: '商品主信息新增',
        meta: { title: '商品主信息新增', icon: 'icon', noCache: true }
      }
    ]
  }
]

},

你期待的结果是什么？实际看到的错误信息又是什么？

可以访问到正确地址。