vueプロジェクトはvue-element-adminオープンソース項目の3つのルートを参照してください.キャッシュできません.

プロジェクトフレームはvue-element-adminを参照してソース項目をオープンし、左側のメニューはルートの設定を読み込みます.
参加したプロジェクトは普通は二級メニューです.だから、keep-aliveでページキャッシュをする時、正しい構成部品nameであればキャッシュができます.しかし、一番近い項目は三級メニューがあります.クリックして切り替えると、ページがキャッシュできなくなります.csdnにはいい説明があります.ここでは簡単な機能だけが実現されます.
ブログのアドレス:https://blog.csdn.net/sinat_31243877/articale/detail/100183468
解决の中心的な考えは、メニューが配置されたルートのレベルで、ルーティングのインスタンスを生成する前に、三段ルートのコンポーネントを二段ルートに入れることです.

{
    path: '/liveSchedules',
    component: Layout,
    name: 'liveSchedules',
    noComponent: true,
    meta: {
      title: '    ',
      icon: 'live',
    },
    children: [
      {
        path: '/liveSchedule',
        component: () =>
                    import('@/components/views/live/liveSchedule/liveSchedule'),
        name: 'liveSchedule',
        meta: {
          title: '     ',
          icon: 'iconfont icon-yunchaitiao',
        },
      },
      {
        path: '/sportsProcessMonitoring/:id(\\d+)',
        component: () =>
                    import('@/components/views/live/liveSchedule/sportsProcessMonitoring'),
        name: 'sportsProcessMonitoring',
        meta: {
          title: '        ',
          icon: 'iconfont icon-yunchaitiao',
        },
        hidden: true
      },
      {
        path: '/secondChannel',
        component: () =>
                    import('@/components/views/live/secondChannel/secondChannel'),
        name: 'secondChannel',
        meta: {
          title: '    ',
          icon: 'iconfont icon-yunchaitiao',
        },
      },
      {
        path: '/viewProgramList/:id(\\d+)',
        component: () =>
                    import('@/components/views/live/secondChannel/programList/viewProgramList'),
        name: 'viewProgramList',
        meta: {
          title: '     ',
          icon: 'iconfont icon-yunchaitiao',
        },
        hidden: true
      },
      {
        path: '/programListSubstantiation/:id(\\d+)',
        component: () =>
                    import('@/components/views/live/secondChannel/programList/programListSubstantiation'),
        name: 'programListSubstantiation',
        meta: {
          title: '      ',
          icon: 'iconfont icon-yunchaitiao',
        },
        hidden: true
      },
      {
        path: '/secondChannelDetail/:id(\\d+)',
        component: () =>
                    import('@/components/views/live/secondChannel/secondChannelDetail'),
        name: 'secondChannelDetail',
        meta: {
          title: '      ',
          icon: 'iconfont icon-yunchaitiao',
        },
        hidden: true
      },
      {
        path: '/firstChannel',
        component: () =>
                    import('@/components/views/live/firstChannel/index'),
        name: 'firstChannel',
        noComponent: true,
        meta: {
          title: '    ',
          icon: 'iconfont icon-yunchaitiao',
        },
        children: [
          {
            path: '/liveBroadcast',
            component: () =>
                            import('@/components/views/live/firstChannel/liveBroadcast/liveBroadcast'),
            name: 'liveBroadcast',
            meta: {
              title: '    ',
              icon: 'iconfont icon-yunchaitiao',
            },
          },
          {
            path: '/liveBroadcastDetail/:id(\\d+)',
            component: () =>
                            import('@/components/views/live/firstChannel/liveBroadcast/liveBroadcastDetail'),
            name: 'liveBroadcastDetail',
            meta: {
              title: '      ',
              icon: 'iconfont icon-yunchaitiao',
            },
            hidden: true
          },
          {
            path: '/liveShow',
            component: () =>
                            import('@/components/views/live/firstChannel/liveShow/liveShow'),
            name: 'liveShow',
            meta: {
              title: 'liveshow  ',
              icon: 'iconfont icon-yunchaitiao',
            },
          },
          {
            path: '/liveShowDetail/:id(\\d+)',
            component: () =>
                            import('@/components/views/live/firstChannel/liveShow/liveShowDetail'),
            name: 'liveShowDetail',
            meta: {
              title: 'liveshow  ',
              icon: 'iconfont icon-yunchaitiao',
            },
            hidden: true
          },
        ],
      },
      {
        path: '/liveProcessMonitor',
        component: () =>
                    import('@/components/views/live/processMonitor/liveProcessMonitor'),
        name: 'liveProcessMonitor',
        meta: {
          title: '    ',
          icon: 'iconfont icon-yunchaitiao',
        },
      },
    ],
  }
function deleteFakeParent(router) {
  var newRouter = { ...router };
  if (!router.children) return newRouter;
  var children = [];
  if (router.noComponent) {
    for (let i = 0; i < router.children.length; i++) {
      const item = deleteFakeParent(router.children[i]);
      if (Array.isArray(item)) {
        item.forEach(el => {
          children.push(el)
        })
      }else{
        children.push(item)
      }
    }
    newRouter = children
  } else {
    for (let i = 0; i < router.children.length; i++) {
      const item = deleteFakeParent(router.children[i]);
      if (Array.isArray(item)) {
        item.forEach(el => {
          children.push(el)
        })
      }
    }
    newRouter.children = children
  }

  return newRouter
}
let backRouters = [].concat(JSON.parse(JSON.stringify(constantRoutes)));
export {backRouters};
const route = deleteFakeParent(constantRoutes[4]); // noComponent     
constantRoutes[4].children = [...route];  // 4