举个例子项目中,这9张图与抽奖次数全是后台ajax请求来的,但是每次进页面的时候我就只要检测抽奖次数是否改变就够了。
首先要用keep-alive缓存当前页面。
注意:页面第一次进入,钩子的触发顺序created-> mounted-> activated,退出时触发deactivated。当再次进入(前进或者后退)时,只触发activated。
然后在页面中写activated函数与created中的方法一致,获取抽奖次数的接口加个参数。
最后在ajax请求中,判断如果是此参数的,就只更新次数,防止图片一直刷新
getshuju:function(type){
var that=this;
this.$http.post(this.GLOBAL.host+'/draw/rewards', {
openId:sessionStorage.getItem("kbj_openId")
})
.then(function (res) {
if(res.data.code==0){
if(type=='act'){ //如果是缓存的页面只更新次数
that.clickcount=res.data.count;
}else{
that.banks=res.data.banks;
that.banklist2=res.data.recommendBanks;
that.prizes=res.data.prizes;
that.clickcount=res.data.count;
}
}else{
Toast({
message:"获取数据失败",
position: 'bottom',
duration: 1000
});
}
})
.catch(function (error) {
Toast({
message:"请检查网络连接",
position: 'bottom',
duration: 1000
});
});
},