van-list的load事件只有在刚切换tab栏的时候触发,滑动到底部也不触发了
时间: 2024-05-16 18:13:52 浏览: 62
这可能是因为在切换tab栏后,van-list的数据已经被加载并渲染出来了,所以在滑动到底部时不会再次触发load事件。
如果你希望滑动到底部时也能触发load事件,可以考虑使用van-list组件提供的`@scroll`事件,判断当滑动到底部时手动触发load事件。具体实现可以参考以下代码:
```html
<van-list
:finished="finished"
:loading="loading"
@load="onLoad"
@scroll="onScroll"
>
<!-- 列表内容 -->
</van-list>
```
```js
export default {
data() {
return {
loading: false,
finished: false,
// 记录滑动到底部的位置
scrollTop: 0
};
},
methods: {
onLoad() {
// 加载数据
// ...
},
onScroll(event) {
// 获取滚动条距离顶部的距离
const scrollTop = event.target.scrollTop;
// 判断是否滑动到底部
if (scrollTop + event.target.clientHeight >= event.target.scrollHeight) {
// 避免重复触发load事件
if (!this.loading && !this.finished && this.scrollTop < scrollTop) {
this.loading = true;
this.onLoad();
}
// 记录滑动到底部的位置
this.scrollTop = scrollTop;
}
}
}
}
```
阅读全文