vue keep-alive解决关闭标签动态缓存问题
生活随笔
收集整理的這篇文章主要介紹了
vue keep-alive解决关闭标签动态缓存问题
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
直接上代碼: <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里不要隨意加"/"他默認的上級路由會改變的
轉載于:https://www.cnblogs.com/li-xue-/p/10562904.html
《新程序員》:云原生和全面數字化實踐50位技術專家共同創作,文字、視頻、音頻交互閱讀總結
以上是生活随笔為你收集整理的vue keep-alive解决关闭标签动态缓存问题的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Sublime text 3 汉化教程
- 下一篇: Go学习笔记07-结构体与方法