vue-waterfall2 瀑布流，触底加载更多

本文主要是介绍vue-waterfall2 瀑布流，触底加载更多，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

监听滚动到底部事件：

function isScrollToBottom() {const scrollTop = document.documentElement.scrollTop || document.body.scrollTop;const scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight;const clientHeight = document.documentElement.clientHeight || document.body.clientHeight;return scrollTop + clientHeight >= scrollHeight-100;
}

在mounted里增加监听scroll：

  mounted() {let _this = thisthis.dataList = this.originDatawindow.addEventListener('scroll', function () {// 判断是否滚动到了底部if (isScrollToBottom() && !_this.loading) {_this.loading = true;// 加载更多内容_this.loadmore()}});},

这样就可以触底loadmore了。。

参考链接：

vue-waterfall2的简介及使用教程 - Made with Vuejs

实现当滚动到页面底部时，加载更多内容_在最底部的分页 切换时 底部变多-CSDN博客

这篇关于vue-waterfall2 瀑布流，触底加载更多的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---