最近做一个项目,使用 vue 搭建,一个简单的列表遍历渲染,一切正常,但是自己手机却出现了问题,列表只显示第一屏,滑动后都是空白。
定位bug
自己是 ios 13.5 系统,于是找了安卓和苹果都做了测试,发现安卓和 ios 12 并没有问题,ios 13 有同样的问题,于是锁定版本。
bug描述
使用 v-for 遍历后 list 只有部分可以显示,其余空白。连接电脑发现 dom 并没有消失,经过一系列排查最终锁定到 position: relative 定位属性上,去掉页面即正常
系统及版本
vue:2.x
vue-cli:4.4.6
系统:ios 13.5
解决方案
在滚动父级添加样式
-webkit-overflow-scrolling: touch;
即可