<template>
<view>
循环请求的数据
</view>
<view>
{{ isLoading ? 加载中...' : '没有更多了' }}
</view>
</template>
export default {
data(){
return{
dataForm:[ ],//分页数据
isLoading:false, //是否加载中
pageNum:1,//请求的页码
pageSize:10,//请求的条数
}
},
// 触底触发
onReachBottom() {
//如果最后一次请求,数据为空的话就停止请求,防止多次触发接口
if(!this.isLoading){
return;
}
this.pageNum++
//调用请求接口
this.getAllList()
},
methods:{
getAllList(){
this.isLoading = true
this.reruest('地址'{
pageNum:this.pageNum,
pageSize:this.pageSize
}).then(res=>{
if(res.code == 200){
const data = res.data.list
this.dataForm = [...this.dataForm,...data]
if(data.length < this.pageSize){
this.isLoading = false
}
}
})
}
}
}
标签:uniapp,pageNum,分页,pageSize,dataForm,isLoading,data,请求 From: https://www.cnblogs.com/xin-kw/p/17515848.html