处理侧边栏三层路由页面不显示问题

vue 后台管理侧边栏三层路由配置

router/index.js 文件

{
    path: "/store",
    component: Layout,
    meta: { title: "知识库管理", icon: "list"},
    children: [
      {
        path: "article",
        name: "article",
        meta: { title: "文章管理", icon: "list"},
        component: () => import("@/views/article/index"),
        children: [
          {
            path: "list",
            name: "articleList",
            component: () => import("@/views/article/list/list"),
            meta: { title: "文章列表", icon: "list"},
          },
          {
            path: "add",
            name: "addArticle",
            component: () => import("@/views/article/add/add"),
            meta: { title: "新增文章", icon: "list"},
          }
        ]
      }
    ]
  },

上面侧边栏路由下有children ，children下面还有children ,这样直接配置页面不会显示页面内容

index.vue 代码如下：

<template>
  <el-alert :closable="false">
      <router-view />
  </el-alert>
</template>
<style lang="scss" scoped>
.el-alert--info.is-light {
    background: #fff;
}
</style>

这样配置后，其余页面都可正常显示，嵌套路由。