vue基于elementui的无限滚动组件

组件代码如下

使用方法

const raFrame =
  window.requestAnimationFrame ||
  window.webkitRequestAnimationFrame ||
  function(callback) {
    return window.setTimeout(callback, 1000 / 60);
  };
export function throttle(fn, context = this, isImmediate = false) {
  let isLocked;
  return function() {
    const _args = arguments;

    if (isLocked) return;

    isLocked = true;
    raFrame(function() {
      isLocked = false;
      fn.apply(context, _args);
    });

    isImmediate && fn.apply(context, _args);
  };
}

属性

参数	说明	类型	可选值	默认值
height	滚动区域的高度，单位像素	String/Number	-	300
loading-text	加载中的文案	String	-	加载中...
loading-spinner	自定义加载图标类名	String	-	el-icon-loading
on-reach-top	滚动至顶部时触发，需返回 Promise	Function	-	-
on-reach-bottom	滚动至底部时触发，需返回 Promise	Function	-	-
on-reach-edge	滚动至顶部或底部时触发，需返回 Promise	Function	-	-
distance-to-edge	从边缘到触发回调的距离。如果是负的，回调将在到达边缘之前触发。值最好在 24 以下。	Number/Array	-	[20, 20]