vue ios滚动不流畅问题

图片.png

由于本人是Android开发工程师,所以对这个不流畅的猜测是,ios本身的布局是有伸缩性,当vue的列表滚动的时候,会发生滚动冲突,所以才导致的不流畅(纯属个人臆测,欢迎打脸)。

由于我的项目一开始用的mint-ui里面的上拉刷新下拉加载,mint-ui又没有使用better-scroll,所以很蛋疼,改起来很麻烦,尤其对我我这种半路出家的。

在几经周折之后,终于痛下决心用了 滴滴的组件库 cube-ui。

用起来也很方便,需要注意的一点就是 外层标签要给写死个高度,高度要小于的高度

  • ...

我这里的wrapperHeight是这个div顶部到屏幕底部的距离,动态算出来的。这样就能保证列表能铺满了。

算的方法如下:

  this.wrapperHeight = document.documentElement.clientHeight - 88;
  window.onload = () => {
    this.wrapperHeight = document.documentElement.clientHeight - 88;
  };

算是无奈的双重保险吧,因为有的机型在调用钩子函数,activated、mounted等方法的时候还没有渲染完成,导致 document.documentElement.clientHeight 是0。

你可能感兴趣的:(vue ios滚动不流畅问题)