分析
微信小程序目前没有提供刷新API,所以要自己去记录当前操作,点击刷新重新执行一遍
效果
点击‘重新加载’重新加载页面
实现
由于做项目时,页面渲染离不开接口请求,所以我封装了一下wx.request来判断是否断网,及断网后记录本次请求
/** * obj request请求参数 * cb requrst请求成功回掉 * page 当前page实例 **/ function wxRequest (obj, cb, page, type) { var isOne = true var cachFn = function () { wx.request({ url: obj.url, data: obj.data || {}, method: obj.method || 'GET', success: function (res) { cb.call(page, res) if (!page.data.isNet) { page.setData({ isNet: true }) } }, // fail执行时当断网处理 fail: function () { // 防止fail 有时会执行两次,影响渲染 if (!isOne) { return } page.setData({ isNet: false, isRequested: false }) // 记录本次请求,加载时,执行page实例的reloadFn即可 page.reloadFn = wxRequest(obj, cb, page, 1) isOne = false } }) } if (type) { page.isRequested = true } return type ? cachFn : cachFn() }
应用
let data = { url: '', data: {}, method: '' } wxTools.wxRequest(data, (res) => { // 数据渲染 this.setData({}) }, this)
断网时,执行this.reloadFn就回重新上一次请求,isNet及判断是否断网