vue-infinite-scroll支持vue3


vue3-infinite-scroll-good

簡介 (introduce)

vue-infinite-scroll的vue3版本,所有用法和vue-infinite-scroll一致。
vue3 version of vue-infinite-scroll. All usages are consistent with vue-infinite-scroll

其代碼也是基於它做了簡單修改,並修復了一些bug,比如重復兩次請求等問題。
The code is also based on it, made simple modifications, and fixed some bugs, such as repeated requests twice.

示例 (Example)

預覽效果:Demo
preview:Demo

示例源碼:在根目錄下的example中
Example source code: in example under the root directory

安裝 (install)

yarn add vue3-infinite-scroll-good

使用 (use)

// 全局注冊 mian.js
import infiniteScroll from 'vue3-infinite-scroll-good'
createApp(App).use(infiniteScroll).mount('#app');
// 組件使用
<div v-infinite-scroll="loadMore" infinite-scroll-disabled="busy" infinite-scroll-distance="10">
  ...
</div>
var count = 0;

new Vue({
  el: '#app',
  data: {
    data: [],
    busy: false
  },
  methods: {
    loadMore: function() {
      this.busy = true;

      setTimeout(() => {
        for (var i = 0, j = 10; i < j; i++) {
          this.data.push({ name: count++ });
        }
        this.busy = false;
      }, 1000);
    }
  }
});

其他(other)

喜歡就給個star
Give a star if you like

百度甲乙丙丁少
Google甲乙丙丁少


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM