vue中,一个列表页从列表详情页返回需要被缓存,从其他页面进入列表不需要缓存,我在main.js中设置
router.beforeEach((to, from, next) => { Vue.prototype.fromurl = from.path; Vue.prototype.tourl = to.meta; if(from.path.substr(3,4)=='shop'){ var bostonetop = $(window).scrollTop(); localStorage.setItem("bostonetop",bostonetop) } else if(from.path.substr(3,13)=='special_field'){ var bostonetop = $(window).scrollTop(); localStorage.setItem("bostonetop",bostonetop) } if (to.path.substr(3,4) =='shop') { if(from.path.substr(3,14)=='product_detail'){ // 思路是进入列表页并从详情页返回加载缓存,其他不加载缓存 to.meta.keepAlive = true; var bostonetop = localStorage.getItem("bostonetop") $('html,body').animate({scrollTop:bostonetop}, 10); } } else if (to.path.substr(3,13)=='special_field') { if(from.path.substr(3,14)=='product_detail'){ to.meta.keepAlive = true; var bostonetop = localStorage.getItem("bostonetop") $('html,body').animate({scrollTop:bostonetop}, 10); } }else{ to.meta.keepAlive = false } next() })
App.vue
<template> <div id="app"> <keep-alive> <router-view v-if="$route.meta.keepAlive"></router-view> </keep-alive> <router-view v-if="!$route.meta.keepAlive"></router-view> </div></template>
router.js
{ path: '/t/shop', name: 'shop', component: shop, meta: { keepAlive: true } },
RT,思路是进入该列表页并从详情页返回加载缓存,其他不加载缓存。但是实际中所有页面进入该页面中都产生了缓存;这不是我想要的,请问上述问题应该如何解决?如何从其他页面进入该页面不加载缓存并从详情返回加载缓存?
九州编程
相关分类