vue cli的學習八 上拉載入和下拉重新整理

2021-10-11 02:52:42 字數 903 閱讀 8802

上拉載入 我們使用vant中vant-list 將需要迴圈的內容 放入即可

說明:

loading 表示載入狀態 觸發onload以後 loading會變成true 表示正在載入  所以請求完成以後需要繼續載入  需要設定成false

finished表示 載入是否完成  一旦設定成true以後上拉 以後將不會請求資料

onload表示 觸發上拉以後要執行的自定義的方法  放的都是資料請求的方法 類似於分頁

額外補充乙個 immediate-check 設定成false  就表示資料 第一次不會自動載入

實際使用  頁面部分  將請求的資料顯示  迴圈的資料是films

} }觀眾評分}

主演:}

}|} 購票

資料宣告

data() ;

},

頁面開啟時候觸發的資料請求  載入第一頁的資料

created() )

.then((res) => );

},

宣告載入的方法  每次上拉就頁面+1  資料總數大於所有資料的時候  完成全部的載入

onload() )

.then((res) =>

});},

配置下拉重新整理  下拉重新整理是指 下拉以後  清空集合  獲取最新的資料 只需要在vant-list上面繼續配置外掛程式

設定好onrefresh的方法  清空資料  設定頁碼為0  再次呼叫onload方法

onrefresh() ,

XListView設定上拉重新整理下拉載入和多條目載入

首先匯入xlistviewlibrary在布局中寫 com.bwie.xlistviewlibrary.view.xlistview可以用ctrl看看是否匯入成功 xlistview.setpullloadenable true 可以上拉重新整理更多 initdata page xlistview....

mui 上拉載入更多的使用

1 在函式自己上拉載入行為後的 函式 該函式是必須要寫的,用來寫自己的邏輯需求,但是一般情況下,需要設定顯示為 載入更多 還是 沒有更多資料了 看了一些部落格和官方文件,基本上都把這個設定放在了定時器中 在定時器中呼叫獲取資料的方法 自己的業務需求 2 在mui封裝的上拉載入中,點選某一項會失效。這...

react 上拉載入元件的使用

移動端前端需要實現分頁功能,與傳統的pc端分頁不同,決定使用螞蟻的長列表元件,支援上拉載入及下拉重新整理 本文只涉及上拉載入 引入元件 1importfrom antd mobile 定義一些初始狀態 12 3456 78910 1112 1314 1516 17constructor this.s...