摘要:今天給大家分享上拉刷新,加載更多的組件的使用第一步安裝第二部配置第三部開始使用內(nèi)容部分如下上拉加載已棄用,下拉刷新
今天給大家分享vue上拉刷新,加載更多的組件VueScroller的使用
第一步安裝:
npm install vue-scroller -D
第二部配置 main.js
import VueScroller from "vue-scroller"
Vue.use(VueScroller)
?第三部開始使用
//內(nèi)容
js部分如下
methods:{ //上拉加載 infinite:function(){ ? ? ? console.log("infinite") ? ? ? this.timeout = setTimeout(()=>{ ? ? ? ? if (this.myData.length >= 20) { ? ? ? ? ?this.$refs.my_scroller.finishInfinite(true); ? ? ? ? }else{ ? ? ? ? ? this.$refs.my_scroller.finishInfinite(false); ? ? ? ? } ? ? ? ? //this.$refs.my_scroller.resize();//已棄用, ? ? ? ? this.myData.push(this.myData[1]); ? ? ? }, 1500) ? ? }, //下拉刷新? ? ? refresh:function(){ ? ? ? console.log("refresh") ? ? ? this.timeout = setTimeout(()=>{ ? ? ? ? this.$refs.my_scroller.finishPullToRefresh() ? ? ? }, 1500) ? ? } }
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/53397.html
摘要:今天給大家分享上拉刷新,加載更多的組件的使用第一步安裝第二部配置第三部開始使用內(nèi)容部分如下上拉加載已棄用,下拉刷新 今天給大家分享vue上拉刷新,加載更多的組件VueScroller的使用 第一步安裝: npm install vue-scroller -D 第二部配置 main.js import VueScroller from vue-scrollerVue.use(VueScr...
摘要:移動端開發(fā),處理列表翻頁和數(shù)據(jù)的時候,下拉刷新和上拉加載應用的比較廣泛,今天給大家推薦一個的插件,,首先上圖話不多說,上代碼了一引入并使用二在或者組件里面使用三在文件里面操作插件首先在在里面寫上方法在里面實現(xiàn)申明好然后繼續(xù)在里面寫上刷新和 移動端開發(fā),處理列表翻頁和數(shù)據(jù)的時候,下拉刷新和上拉加載應用的比較廣泛,今天給大家推薦一個vue的插件,vueScroll,首先上圖: showIm...
摘要:因為業(yè)務的需要界面需要實現(xiàn)分頁的功能,所以我就研究了一下如何利用自帶的組件實現(xiàn)上拉加載更多功能。代碼如下上拉加載更多初始化方法如下下面便是上拉加載更多的方法這樣就大功告成啦 因為業(yè)務的需要界面需要實現(xiàn)分頁的功能,所以我就研究了一下如何利用mint-ui自帶的loadmore組件實現(xiàn)上拉加載更多功能。 首先在文件中引入組件 import {Indicator, Loadmore} f...
閱讀 3399·2021-09-22 15:01
閱讀 527·2019-08-30 11:11
閱讀 958·2019-08-29 16:17
閱讀 1213·2019-08-29 12:23
閱讀 2029·2019-08-26 11:48
閱讀 3180·2019-08-26 11:48
閱讀 1420·2019-08-26 10:33
閱讀 1932·2019-08-26 10:30