Loading more functions on uni-app:https:///article/
Uni-app data drop-down refresh
In the configuration file, turn on the drop-down refresh effect separately for the current goods_list page:
"subPackages": [{
"root": "subpkg",
"pages": [{
"path": "goods_detail/goods_detail",
"style": {}
}, {
"path": "goods_list/goods_list",
"style": {
"onReachBottomDistance": 150,
"enablePullDownRefresh": true,
"backgroundColor": "#F8F8F8"
}
}, {
"path": "search/search",
"style": {}
}]
}]The onPullDownRefresh event handler function that listens to the page:
// Pull down to refresh eventsonPullDownRefresh() {
// 1. Reset key data = 1
= 0
= false
= []
// 2. Re-submit request (() => ())
}
Modify the getGoodsList function, receive the cb callback function and make calls as needed:
// Method to get product list dataasync getGoodsList(cb) {
= true
const { data: res } = await uni.$('/api/public/v1/goods/search', )
= false
// As long as the data request is completed, the cb callback function will be called immediately as needed cb && cb()
if ( !== 200) return uni.$showMsg()
= [..., ...]
=
}
Uni-app pull-up loading more functions:https:///article/
Attachment: (OBJECT)
Start pull-down refresh through (OBJECT), and trigger the pull-down refresh animation after calling, the effect is consistent with the user's manual pull-down refresh.
<template>
<view>
<view v-for="(item,index) of list" :key="index">
{{item}}
</view>
<button @click="pullDown">Click to trigger the drop-down refresh</button>
</view>
</template>
<script>
export default {
data() {
return {
list: [1, 2, 3, 4, 5]
}
},
methods: {
pullDown() {
//Trigger pull-down refresh ()
}
},
onPullDownRefresh() {
("Trigger pull-down refresh")
setTimeout(() => {
= [1, 2, 3, 5, 3, 2]
//Close drop-down refresh ()
}, 2000)
}
}
</script>
<style>
</style>
Summarize
This is the end of this article about uni-app implementing data drop-down refresh function. For more related uni-app data drop-down refresh content, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!