如何有效解决基于 keep-alive 的多级路由缓存难题？

本文共计1273个文字，预计阅读时间需要6分钟。

使用vue-element-admin的同学们一定很清楚，其配置路由时，直接关联侧边栏导航菜单的展示，这种设计思路也得到了广泛的应用。包括我写的Fantastic-admin，也采纳了这种方案。

用过 vue-element-admin 的同学一定很清楚，路由的配置直接关系侧边栏导航菜单的展示，也得益于这种设计思路，几乎大部分后台框架都采用这个方案，当然也包括了我写的 Fantastic-admin 这个中后台框架。

但这个方案有个明显的问题，就是为了实现多级侧边栏导航菜单，则需要将路由配置成多级嵌套的形式，一旦超过两级，达到三级甚至更多级，就需要增加一个空布局页面（Empty.vue）用来给 component 使用，仅仅是为了生成层级菜单。此时就出现了一个问题，因为 keep-alive 是在 Layout 上处理的，所以超过两级以上的路由都会变得难以处理，也没有一个相对完美的解决方案。