先来说一下最终实现的效果:
1,顶部标签页可以切换,所有打开的标签页对应的页面需要缓存
2,标签页可以手动关闭,关闭后对应页面不再缓存,再次打开需要刷新页面
3,对某些特定的页面始终不需要缓存(这里用到了exclude,keep-alive的exclude比include优先级高)
这个图亲妈都不认识了吧...
直接给代码吧,一些文字描述都放在注释里了
elmenu.vue
<template>
<el-menu>
<el-submenu>
<label v-for="(subItem, subIndex) in menuList"
:key="subIndex">
<el-menu-item :index="subItem.menuUrl"
:route="subItem.menuUrl"
@click="addMenuBreadcrumb(subItem)">
<span slot="title">{
{ subItem.menuName }}</span>
</el-menu-item>
</label>
</el-menu>
</