uniapp scroll-view滑到底部加载更多数据

官网

必须设置下面两个属性

1. scroll-y="true" 

2. height:90vh;

    //lowerBottom触底事件
<scroll-view @scrolltolower="lowerBottom" style="height:90vh;" scroll-y="true">
   //list:展示的数据
    <view class="list" v-for="(item,index) in list" :key="index" >
        {{item.content}}
    </view>	
    //bottomText底部文字
	<view class="medicine_title">
		{isBottom?'没有更多数据了～':'下拉加载更多'}}
	</view>
</scroll-view>

data数据

list:[],   //展示的数据
//分页参数，跟后台协商参数
listQuery:{
    page:1,
    size:10,
},
//判断是否请求完毕数据
isBottom: false,

进入页面加载完请求第一页数据（onLoad）或者切入前台请求（onShow），根据需求修改，我这里是onLoad

onLoad(options) {

    this.listInit()
},
methods:{
    listInit(){
		this.listQuery.page = 1
		this.list = []
		this.isBottom = false
		this.getList()
	},
    async getList(val) {
		let query = this.listQuery
        //请求数据 ，此为封装后的请求接口方法
		let list = await this.$request(‘接口地址’, 'get', query)
		this.list = this.list.concat(list.data.item)
        //判断是否请求完毕
		if (list.data.item.length < this.listQuery.size) {
			this.isBottom = true
		}
	},
    // 滚到底部
	lowerBottom() {
		if (!this.isBottom) {
			this.listQuery.page += 1
			this.getList()
		}
	},
}