美文网首页
[web]better-scroll滚动无效几种原因

[web]better-scroll滚动无效几种原因

作者: hulaye | 来源:发表于2018-08-10 09:03 被阅读0次

better-scroll 是一个移动端滚动的解决方案,使用的时候需注意一下问题:
一、DOM层级关系

<div class="wrapper">
  <div class="content">
    content...
  </div>
</div>

wrapper里面不能存在多个同级div,如果你这样写:

<div class="classifyTitle"  ref="wrapper">
    <div class="">
    ss
    </div>
    <ul>
    <li v-for="(item,index) in classifyData.products">
        <router-link :to="{name:'详情'}">{{item.title}}</router-link>
    </li>
    </ul>
</div>

那么ul中的元素将不能滚动

二、content是否被成功添加滚动相关style

三、wrapper 与 content 高度问题

只有content的高度大于wrapper高度时候,才可以滚动。

四、wrapper样式

.wrapper元素上要给定位

position: absolute;
left: 0;
top: 0;
overflow: hidden;

相关文章

网友评论

      本文标题:[web]better-scroll滚动无效几种原因

      本文链接:https://www.haomeiwen.com/subject/gsahbftx.html