indebounce解决ios在h5中的橡皮回弹问题

由于使用了套壳打包了苹果ios的描述文件。用户下载描述文件即可安装成为一个手机app。
但本质依旧是浏览器访问某个栈点。
目前项目中存在一个明显的缺点就是不能设置刘海透明。此外，就是ios自带的橡皮回弹问题。为了解决这个回弹问题在uniapp中引入了indebounce.js。
查看许多博客写的都是给一个git地址，然后下载之后，将里面的js文件放到自己的项目中，然后再用标签的形式引入，最后使用。
尝试过后发现并不生效，于是就用npm 来下载，然后在main.js中import引入，最后调用方法进行使用。
1.npm install inobounce -s
2.在main.js中引入一下

import inobounce from 'inobounce';
Vue.prototype.$Inobounce = inobounce;

3.开始使用，在需要的页面中直接使用，里面有许多方法，比如enable顾名思义就是允许，开启，disable就是关闭

this.$Inobounce.enable();
this.$Inobounce.disable();

在这里顺便多说一句，iOS的h5页面，如果页面有滚动条，关闭了indebounce的话，在滚动结束的时候，也就是顶部和底部，依旧会出现橡皮回弹现象，
查找了很多的资料，最后结论就是无解。
但是用户快要滚屏到头部的时候，橡皮回弹的原因会导致头部可以被下拉一段距离而且是一片空白，如下图

这时候，客户肯定是接受不了的。那又不能解决这个问题，起码要做点什么稍微掩盖一下。
于是乎，加了一个自定义的下拉loadig。这个下拉loading亦是有一个小问题:一般下拉到一定高度，手停止触屏时候才触发刷新，滚动的过程中也一样有可能触发刷新，
这里使用了 @touchend="fingerend"捕捉用户的动作
方法里面就是变量的改变，触发后多久收起

 fingerend(e) {
      // 当前位置 减去 按下位置 计算 距离
      const subX = e.changedTouches[0].clientX - this.startData.clientX;
      const subY = e.changedTouches[0].clientY - this.startData.clientY;
      if (this.flag === 1) {
        setTimeout(() => {
          // console.log("触发抬起");
          this.triggered = false;
          this._freshing = false;
          e.preventDefault();
          this.flag = 0;
        }, 2000);
      }
}

 <scroll-view
      scroll-y
      class="contentbody"
      :refresher-enabled="isOpenRefresh"
      :refresher-triggered="triggered"
      :refresher-threshold="200"
      :scroll-anchoring="true"
      refresher-background="white"
      @refresherpulling="onPulling"
      @refresherrefresh="onRefresh"
      @refresherabort="onAbort"
    ></scroll-view>

// 自定义下拉刷新控件被下拉
    onPulling(e) {
      // console.log("onpulling", e.detail.deltaY);
      // e.detail.deltaY<0防止上滑页面也触发下拉, <200与下拉组件的配置保持一致，这样可以减少触发刷新的概率
      if (e.detail.deltaY < 200) {
        return;
      } else {
        this.triggered = true;
        this.flag = 1;
      }
    },

备注：如果非要刻意的去拖拽，这个橡皮回弹是无法解决的，除非ios开发，不使用uniapp h5 ，正常使用的情况是可以大程度掩盖这个问题的