我們在運(yùn)用uni-app開發(fā)小程序或h5時蕊温，常常需要頁面實(shí)現(xiàn)下拉刷新功能。
在 js 中定義 onPullDownRefresh 處理函數(shù)（和onLoad等生命周期函數(shù)同級）傻工，監(jiān)聽該頁面用戶下拉刷新事件。
步驟：
1、需要在pages.json 里，找到的當(dāng)前頁面的pages節(jié)點(diǎn)掏父，并在 style 選項(xiàng)中開啟enablePullDownRefresh。
2秆剪、當(dāng)處理完數(shù)據(jù)刷新后赊淑，uni.stopPullDownRefresh可以停止當(dāng)前頁面的下拉刷新。
示例
pages.json
{
"pages": [
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "uni-app",
"enablePullDownRefresh": true
}
}
],
"globalStyle": {
"navigationBarTextStyle": "white",
"navigationBarBackgroundColor": "#0faeff",
"backgroundColor": "#fbf9fe"
}
}
index.vue
// 僅做示例鸟款，實(shí)際開發(fā)中延時根據(jù)需求來使用膏燃。
export default {
data: {
text: 'uni-app'
},
onShow: function (options) {
this.loadData();
},
onPullDownRefresh() {
this.loadData()
}
methods:{
loadData() {
this.$http('/data', {}, 'get').then((res) => {
//數(shù)據(jù)請求完成之后停止下拉刷新
uni.stopPullDownRefresh();
if (res.status) {
this.activityList = res.data
}
})
}
}
}