vant實現上拉載入下拉重新整理的效果

2021-10-09 10:36:23 字數 1461 閱讀 6280

="onload"

>

下拉重新整理,上拉載入更多

v-model=

"searchval"

show-action

placeholder=

@search=

"onsearch"

>

"onsearch"

>搜尋<

/div>

<

/template>

<

/van-search>

"primary"

>搜尋<

/van-button>

"refreshing" @refresh=

"onrefresh"

>

v-model=

"loading"

:finished=

"finished"

finished-text=

"沒有更多了"

@load=

"onload"

>

="content-box" v-

for=

"(item,index) in list"

:key=

"index"

>

}<

/div>

<

/van-list>

<

/van-pull-refresh>

<

/div>

<

/template>

export

default},

components:

,mounted()

, methods:

,onload()

}).then

(res =>

this

.total = res.data.data.total;

//全域性儲存總條數 用於判斷是否還有分頁

if(getnew ==

null

|| getnew.length ==0)

this

.list =

this

.list.

concat

(getnew)

//重點來了:此時要判斷是否還有分頁?if(

this

.list.length >=

this

.total)

elseif(

!this

.finished)})

},onrefresh()

,},}

<

/script>

<

/style>

"less" scoped>

.content-box

<

/style>

親測有效,如有不對的地方請您多多指教!

朕,累了~

vant下拉載入更多,上拉重新整理

list 元件通過loading和finished兩個變數控制載入狀態,當元件滾動到底部時,會觸發load事件並將loading設定成true。此時可以發起非同步操作並更新資料,資料更新完畢後,將loading設定成false即可。若資料已全部載入完畢,則直接將finished設定成true即可。v...

下拉重新整理上拉載入

implements ixlistviewlistener 在oncreat裡面寫的 下拉重新整理是否啟用 xlistview.setpullrefreshenable true 載入更多是否啟用 xlistview.setpullloadenable true xlistview重新整理和載入更多...

下拉重新整理上拉載入

下拉載入上拉重新整理 需求 看看包是否有錯 然後在布局中把listview 改為 xlistview檔名 在activity找到控制項 xlistview xlistview view.findviewbyid r.id.xlistview xlistview setpullloadenable t...