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

监听滚动到底部事件:

javascript 复制代码
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:

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

这样就可以触底loadmore了。。

参考链接:

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

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

相关推荐
stereohomology13 小时前
MS Edge很多事的一点是把地址栏复制的地址自动转标题文本
前端·edge
imaol114 小时前
链表 -- 环链表
java·前端·链表
imaol114 小时前
链表 -- 双向链表
java·前端·链表
东风破_14 小时前
大前端手里的 Next.js:从 #root 到 SEO,一份 HTML 的两种命运
前端·后端
IT_陈寒14 小时前
Vue的v-for不听话?我被这个Key的坑整懵了
前端·人工智能·后端
王林不想说话15 小时前
ES6 到 ES2026 全面进阶指南:新特性、原理、示例与工程落地
前端·javascript·面试
用户435237138149315 小时前
🚀 Vue3 + TypeScript 学习笔记:从泛型 T 到 Promise<T>,终于搞懂了 keyof 和 typeof
前端
跟着群主去吃肉15 小时前
Cinemachine的应用-第三人称视角
前端·unity3d·游戏开发
东方小月15 小时前
从零开发一个 Coding Agent(十):实现 CLI 参数解析与静态命令
前端·人工智能·开源
阿黎梨梨15 小时前
Next.js 全栈开发:从 SPA 的痛点到 SSR 的破局之道
前端·后端