自己写个demo学习mintui的时候,使用到了Infinite scroll组件,碰到了个问题

先说问题

官方的文档 infinate-scroll

引入

import { InfiniteScroll } from 'mint-ui';

Vue.use(InfiniteScroll);
复制代码
<ul
  v-infinite-scroll="loadMore"
  infinite-scroll-disabled="loading"
  infinite-scroll-distance="10">
  <li v-for="item in list">{{ item }}</li>
</ul>
复制代码

为 HTML 元素添加 v-infinite-scroll 指令即可使用无限滚动。滚动该元素,当其底部与被滚动元素底部的距离小于给定的阈值(通过 infinite-scroll-distance 设置)时,绑定到 v-infinite-scroll 指令的方法就会被触发

loadMore会一直触发?什么鬼

解决方法

在包裹ul的外层容器上设置height 或 设置 overflow-y:hidden

Logo

前往低代码交流专区

更多推荐