前言：uniapp自带下拉刷新，上拉加载功能基本可以满足刷新需求，但是顶部有状态栏的页面就得进行特殊处理，使用scroll-view解决，状态栏会连带被下拉问题
1、uniapp自带下拉刷新、上拉加载
在page.json中对应页面路由设置【enablePullDownRefresh】值为true（开启下拉刷新）
代码：
//下拉刷新触发方法(和onLoad同级)onPullDownRefresh () {this.params.pageNum = 1 this.PostCollectList() //获取数据},//上拉加载触发方法onReachBottom() {if(this.hasNextPage){ //判断是否还有数据需要加载this.params.pageNum = this.params.pageNum+1this.loading.status = "loadingText"this.PostCollectList() //获取数据}else{this.loading.status = "nomoreText"}},onLoad() {},methods: { PostCollectList() {let params = {...this.params } PostCollectList(params).then(res => { let data = res.data.data || [] this.list = this.list.concat(data) this.total = res.data.total this.hasNextPage = res.data.hasNextPage uni.stopPullDownRefresh() //结束下拉刷新 if(this.hasNextPage){ this.loading.status = "loadmoreText" }else{ this.loading.status = "nomoreText" } }) },}2、使用scroll-view实现刷新，官网地址：scroll-view | 微信开放文档
需要注意：
官网中方法有带【bind】,使用@的话需要将bing去掉（@refresherpulling="refresherpulling"）或者（bindrefresherpulling="bindrefresherpulling"）
使用scroll-view必须设置一个高度
代码：
<template> <view> <scroll-view scroll-y="true" //设置纵向滚动 :style="{height: scprllHeight + 'rpx'}" //设置高度 :refresher-threshold="100" //设置下拉范围 @refresherrefresh="refresherrefreshFun" //下拉刷新被触发 @refresherpulling="refresherpullingFun" //正在下拉执行刷新操作 :refresher-triggered="isRefresher" //设置是否刷新变量 @scrolltolower="scrolltolowerFun" //滑动底部触发事件 refresher-enabled="true" //开启自定义下拉刷新 refresher-default-style="none"> <view class="content-box"> //需要滚动的内容 </view> </scroll-view> </view></template>data() { return { isRefresher: false, //下拉刷新状态 }},methods: { //请求数据 PostCollectList() { //数据请求返回后从设刷新状态值 this.isRefresher= true }, // 下拉刷新被触发refresherrefreshFun() {this.list = []this.params.pageNum = 1this.PostCollectList()},// 下拉刷新触发refresherpullingFun() {this.isRefresher= true},//上拉加载，页面滑动到底部加载分页数据scrolltolowerFun() {if(this.hasNextPage){this.params.pageNum = this.params.pageNum+1this.loading.status = "loadingText"this.PostCollectList()}else{this.loading.status = "nomoreText"}}}
