微信小程式 下拉重新整理 上拉載入

2022-02-25 09:12:46 字數 722 閱讀 8055

1.下拉重新整理

小程式頁面整合了下拉功能,並提供了介面,我們只需要一些配置就可以拿到事件的**。

具體頁面的.json檔案:

1

1

"window":

2. 在js檔案中新增**函式

// 下拉重新整理**介面

onpulldownrefresh: function () ,

3. 新增資料

通常情況下的下拉重新整理操作,就是把查詢條件重置,讓頁面顯示最新的一頁資料。下面是筆者demo中的下拉重新整理**介面的**,同時也是一般情況下的操作流程。

1

// 下拉重新整理**介面

2onpulldownrefresh: function () ,

2 .上拉載入

同下拉重新整理一樣,小程式中也提供了用於上拉時**的介面。官方文件中並沒有很詳細的介紹,經測試發現,上拉**的介面並不需要額外的配置(下拉時需要在 .json檔案中配置 "enablepulldownrefresh": true),直接在頁面滑動到底部時就能拿到**。

1. 在js檔案中新增**函式

1

// 上拉載入**介面

2onreachbottom: function () ,

微信小程式上拉載入,下拉重新整理

首先在對應的json檔案中開啟 enablepulldownrefresh true首先介紹上拉載入的方法 1.data中定義 data 2.請求資料方法 getcompanylist data success res if res.data.items 0 else let listdata th...

微信小程式 上拉重新整理和下拉載入

上拉重新整理和下拉加載有兩種方式可以實現 1.使用scroll view元件進行操作,使用自帶的scrolltoupper和scrolltolower事件可以實現。適合頁面區域性的上拉下拉。附上文件 2.使用page頁面事件處理函式 onpulldownrefresh 下拉重新整理 和 onreac...

微信小程式下拉重新整理和上拉載入更多

因為專案裡面,經常會用到此功能,所以我們封裝乙個外掛程式。裡面應用到vant的元件 1.在compontent裡面建立乙個檔案,名字隨意 布局檔案 message scroll view client pool list scroll y lower threshold 1 bindtouchsta...