vue自定义指令v-scroll。下拉加载更多

最新推荐文章于 2025-03-21 14:51:53 发布

YoLoViga

最新推荐文章于 2025-03-21 14:51:53 发布

阅读量1.2k

点赞数

文章标签： javascript vue js

本文链接：https://blog.csdn.net/weixin_45029416/article/details/108255833

版权

vue自定义指令v-scroll

用于下拉加载更多

import Vue from 'vue';
Vue.directive("scroll", {
  inserted: function(el, bind, vnode) {
    let scrollHeight = el.offsetHeight,
      cb_name = bind.expression, // 绑定的函数名
      cb = vnode.context[cb_name]; 
    el.addEventListener("scroll", async () => {
    		// +1防止高度不够
          if (scrollHeight + el.scrollTop + 1 >= el.firstChild.clientHeight) {
        try {
          cb && (await cb()); // 触发绑定的函数
        } catch (error) {
          console.log(error);
        }
      }
    });
  }
});