刚开始默认沿用了前边小程序的做法,即在单击事件或者onHide函数中缓存标识,onShow中读取标识,对必要的业务逻辑进行重新请求。具体代码如下:
微信小程序登录后页面回调的处理方案:
1.缓存回调刷新标识:
单击事件中设置:
methods:{ onSubmit(){ this.setData({ isRefresh:true }) } }
或者直接onHide函数中设置:
onHide(){ this.setData({ isRefresh:true }) }
2. onShow函数中读取刷新标识,如果为真则刷新页面,对必要的业务逻辑进行重新请求:
onShow: function() { if (this.isRefresh) { this.init() this.setData({ isRefresh:false }) } }
但是到uniapp中就不行了,如果还按上边的方式,很可能会连续两次跳转到登录页面。
异常解析:
经验证,如果onLoad函数中发生了路由跳转,那么生命周期加载顺序是这样的:onLoad——onShow——onReady,这就跟小程序大相径庭了。
结果就是onLoad设置了刷新标识,onShow跟随而来,页面还没跳转出去,就已经进行回调了,最终结果就是跳了两次登录页面。
那么怎么处理呢?
解决方案:
可以采用路由跳转的回调函数,在回调函数中设置页面刷新标识,这样就能避免上边的异常情况发生了,具体代码如下:
onLoad() { if (uni.getStorageSync("authTicket")) { this.init(); } else { uni.navigateTo({ url: "/pages/login/index", success() { self.isRefresh = true; } }); } }, onShow: function() { if (uni.getStorageSync("authTicket") && this.isRefresh) { this.init(); this.isRefresh = false; } }
后记:
uniapp尤其是纯原生渲染nvue,总会有一些与小程序、h5不同的地方,而且调试还没有那么方便,报错信息经常性的指向代码不准确,这个就只能通过console.log多输出日志查看了。
标签:uniapp,登录,onShow,标识,跳转,isRefresh,页面 From: https://www.cnblogs.com/xyyt/p/17917621.html