小程序踩坑系列

小程序-----下拉加载/上拉刷新

• scroll-view标签可以用bindscrolltolower触发上拉加载功能，bindscrolltoupper可以触发下拉刷新功能，但一般不用下拉刷新（触发有问题，会出现双滚动条等），下拉刷新用page里的onPullDownRefresh来实现，但在130400版本后小程序挖了个深坑：
• 在130400版本后在scroll-view标签的区域内不支持onPullDownRefresh（神坑啊），如果scroll-view高度设置为100%的话会发现不管怎么下拉就是触发不了刷新功能（在这说下，scroll-view高度设置为100%的话，父元素也要有实质的高，通常是page设置为100%；）。

解决方法：

• 不要用scroll-view标签；
• 在page属性里有onReachBottom方法，触底事件，可以弥补上拉加载事件，so：上拉加载和下拉刷新都用page里的方法就没问题了。
• 上拉加载：onReachBottom；
• 下拉刷新：onPullDownRefresh；

小程序-----网络中断，重新加载，返回上层

网络中断或者加载失败的情况下，跳转到指定到404页面，页面点击重新加载按钮；如果是从首页进入或者关闭小程序再进入到话再次点击将推出小程序；

找了很长时间发现可以通过获取当前页面信息栈，想要通过全局变量来储存上层路由地址来点击跳转，后来发现如果网络扔是中断状态，每点击一次页面信息栈里到路由会向上找一层直到最顶层（也就是首页）；

最终想出个办法，当点击的时候先判断下是否有网络，没有就直接提示，有的话再跳转上一页，如果上层路由为空或者当前404页面的话就直接跳转到首页，不然会直接关闭小程序；

goto() {
    var pages = getCurrentPages();//获取当前页面信息栈
    let checkNet = new Promise(function (resolve, reject) {
      wx.getNetworkType({
        success(res) {
          // wifi/2g/3g/4g/unknown(Android下不常见的网络类型)/none(无网络)
          if (res.networkType === 'none') {
            wx.showToast({
              title: "请检查网络链接"
            })
          } else {
            resolve();
          }
        }
      });
    })
    checkNet.then(function () {
      if (this.data.type === 'pickCourse' || this.data.type === 'noContent' || pages[0].route == "pages/modal/modal") {
        wx.switchTab({
          url: `/pages/index/index`
        })
      } else {
        wx.navigateBack({//TODO:如果网络出错就返回上一级，回来会重新加载
          delta: 1
        })
      }
    })
  }
复制代码

转载于:https://juejin.im/post/5aeaf3246fb9a07ac76ea952