@mfelibs/inf-scroll

无限滚动

安装

yarn add  @mfelibs/inf-scroll --save

通过 imort 导入

import infScroll from '@mfelibs/inf-scroll'

###demo

npm run dev demo

使用

directives:{
    infScroll:infScroll,
},
data:{
    params:{
        callback:this.load,//scroll回調方法
        disabled:false    //禁止滚动
    },
    params2:{
        callback:this.load2,//scroll回調方法
        disabled:false    //禁止滚动
    }
}
methods:{
    load(){
        for(let i = 0;i < 10; i++){
            this.items.push({
                name:i
            })
        }
    }
     load2(){
        for(let i = 0;i < 10; i++){
            this.items.push({
                name:i
            })
        }
    }
}

<template>
  <ul class="inner" v-infScroll="params" distance="100" :data-disabled="xxx">
            <li v-for="(item,index) in items">{{index}}</li> 
        </ul>
<ul class="inner" v-infScroll="params2" distance="100" :data-disabled="xxx">
            <li v-for="(item,index) in items">{{index}}</li> 
        </ul>
</template>

配置参数

| 参数 | 说明 | 类型 | 默认值 |

| ---------- | :---------- : | :----------: | ----------: |

| v-infScroll | 必要。滚动到底部时出发的自定义方法 | Object | 无 |

| distance | 开始触发自定义方法时滚动区域距离底部的距离 | Number | 500 |

| gap-time | 滚动时截流的最小间隔| Number | 1000 |

| first-check | 阻止首次请求，在一些业务场景下，第一次的请求不使用自定义指令方法加载列表，这时可以把参数置为false| Boolean | false |