vue 使用afterEach判断后用widow.localtion.reload刷新问题
0
悬赏园豆：5
[已解决问题]
解决于 2018-04-26 11:51
在vue项目中,遇到一个这样的问题:
A,B,C三个路由,A->B->C, 其中A->B每次进入都需要刷新, B和C可以来回多次切换并且B数据不刷新.
我的思路是:用keep-alive缓存组件, A->B时强制刷新页面.
实现A->B: 用afterEach判断to,from的name分别符合B和A时,用widow.localtion.reload()强制刷新B页面.
问题出现在了A->B中:
以上思路实现的方法在Chrome和安卓机上没有问题,可以成功跳转到B页面并刷新, 但是在safari和IOS真机上都出现了A页面原地刷新,进入不到B中.
//A页面中的点击跳转行为
getCliam(){
console.log('getCliam');
this.$router.push('/claim/claimForm');
},
//main.js导航钩子函数
router.afterEach((to, from) => {
if(to.name=='claimForm'&&from.name=='claimList'){
console.log('afterEach')
window.location.reload();
}
})
哪位懂得大佬帮忙看下什么原因,难道有兼容性问题?或者以上不用跳转用keepAlive的一些处理方法实现A->B刷新新页面,B和C的都可以缓存?
非常感谢!
最佳答案
0
页面跳转你为什么要刷新?
收获园豆：5
因为用了keepAlive缓存组件,A->B的过程如果再次进入会用之前缓存的B的页面不刷新
@且醉: keepAlive 是可以控制某些路由缓存,某些路由不缓存的 ,百度一下即可
@Grewer: 有百度的,研究了一天,但不太符合我的需求.
默认显示A页面,B是一个很多数据的表单,B和C可来回切换最好是不要重新渲染数据,即B是要缓存的, 但是A->B的过程又不想缓存B,不知道怎么控制了
@且醉: 进入 B 页面的时候判断一下来源,根据页面判断,是否将数据设置为默认值不就行了
@Grewer: 也想过这样,不过觉得初始化的数据也相对较多,所以想强制刷新一下省事,结果就遇到了这种问题.
