scroll-view的下拉刷新
video.wxml中
<scroll-view
class="videoScroll"
scroll-y="true"
refresher-enabled="true"
bindrefresherrefresh="handleRefresher"
refresher-triggered="{{isTriggered}}">
//如果只开启refresher-enabled="true" 页面只会下拉刷新,但是不会回去,下拉刷新的图标一直存在,所以需要设置一个自定义下拉刷新被触发
video.js中
data: {
videoGroupList:[], //导航标签数据
navId:'', //导航标签的id标识
videoList:[], //视频列表数据
videoId:'', //video标识
videoUpdateTime:[], //记录实时播放的时长
isTriggered:false, //定义一个用来表示下拉刷新是否被触发,当更新完数据需要重新定义为false
},
// 获取视频列表数据的功能函数
async getVideoList(navId){
let videoListData=await request('/video/group',{id:navId})
let index=0
if (videoListData.datas) {
let videoList=videoListData.datas.map(item=>{
item.id=index++
return item
})
// 关闭消息提示框
wx.hideLoading()
this.setData({
videoList,
isTriggered:false //加载更新完数据重新变为false,这时下拉刷新的图标也会消失
})
}
},
// 下拉刷新回调
handleRefresher(event){
// 发送请求获取最新的视频数据
this.getVideoList(this.data.navId)
},
页面的下拉刷新
video.json中添加enablePullDownRefresh为true就可以开启
"enablePullDownRefresh":true