vue移动端触底刷新

在Vue移动端中，实现触底刷新的方法可以使用"vue-scroller"插件。在下拉刷新和触底加载的方法中，我们可以使用该插件提供的方法来实现关闭底部加载转圈和关闭下拉转圈的功能。具体代码如下所示：

import Vue from 'vue'
import VueScroller from 'vue-scroller'
Vue.use(VueScroller)

// 下拉刷新方法
onRefresh() {
this.queryParams.pageNum = 1
setTimeout(() => {
Toast('刷新成功')
this.$refs.scroller.finishPullToRefresh() // 关闭下拉转圈
}, 1000)
},

// 触底加载方法
onScroll() {
setTimeout(() => {
console.log("触底加载了!")
this.getIncomeList()
this.$nextTick(() => {
this.$refs.scroller.finishInfinite(true) // 关闭底部加载转圈
})
}, 1000)
}

使用这些方法可以实现在Vue移动端中进行触底刷新的功能。通过调用相应的方法，可以在页面中实现下拉刷新和触底加载的效果。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [【vue-scroller】vue移动端插件，监听下拉触底，上拉刷新](https://blog.csdn.net/qq_51055690/article/details/130770259)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]