tl

tiger-load

Vue the loadmore component

Showing:

Popularity

Downloads/wk

11

Maintenance

No Maintenance Data Available

Package

Dependencies

1

Size (min+gzip)

1.2KB

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

Readme

tiger-load

用于列表页面的加载

安装

npm install tiger-load --save

API

  1. loadFun:加载列表的函数 必须
  2. loadPos:滑动到多少开始加载 非必须 默认0.75

使用

    <tiger-load :loadFun="ajax">
      <ul>
        <li v-for="item in list" :key="item.id">{{item.name}}</li>
      </ul>
    </tiger-load>

  import Vue from 'vue'
  import load from 'tiger-load'
  Vue.use(load)

  export default {
    data(){
      return{
        isLock:false, // 防止在返回前加载多条
        pageIndex:1,
        pageSize:10,
        list:[]
      }
    },
    methods:{
     async ajax(){
       if(!this.isLock){
          this.isLock = true
          const { list } = await this.$http(`url?index=${this.pageIndex}&size=${this.pageSize}`)
          this.list = this.list.concat(list)
          this.pageIndex++
          this.isLock = false
        }
      }
    }
  }

备注

  1. 使用时请保证第一次加载即出现滚动条

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100