直接上代码： <keep-alive :include='topNavMentNames'> 　　<router-view ></router-view> </keep-alive> include会选择性的缓存，没有的会选择不缓存， exclude则相反， topNavMentNames 是数组这里面存的是个组件的name名！大致长这样["a","b","c"]  ,注意是在文件里name名！关闭标签时就splice截取掉topNavMentNames 里相对应的组件名。 例子： export default { 　　data() { 　　　　return { 　　　　　　name:'app_userCtrl', //页面里的name名 　　　　} 　　} } 我之前 这样是不好使的！尝试了各种办法 结果原因是我的路由有问题！路由梳理一下 要按正规的走 我的路由大致是这样的: routes: [ { path: '/home', component: Home, name: 'Home', redirect: '/home/table', children: [ { path: 'table', name: '表格', component: resolve => require(['../view/nav/Table.vue'], resolve) }, { path: 'form', name: '表单', component: resolve => require(['../view/nav/Form.vue'], resolve) }, { path: 'charts', name: 'Charts', component: resolve => require(['../view/nav/charts.vue'], resolve) }, { path: 'article', name: '文章', component: r => require(['../view/nav/Article.vue'], r) }, { path: 'article/add', name: '新增文章', component: r => require(['../view/admin/Post.vue'], r) }, { path: 'article/:postId', name: '文章详情', component: r => require(['../view/admin/PostDetail.vue'], r) } ] }, ] 因为路由时从后端传过来的，路由path里不要随意加"/"他默认的上级路由会改变的