uniapp滚动分页

抄的

<template>
	<view>
		<view v-for="(item,index) in list" :key="index"></view>
		<view class="loadingText">{{loadingText}}</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: []
				page: 1,
				loadingText: '上拉显示更多'
			}
		},
		onLoad(options) {
			this.getList()
		},
		onPullDownRefresh() {
			this.page = 1
			this.getList()
		},
		onReachBottom() {
			this.getMoreList();
		},
		methods: {
			getList() {
				this.$agreementApi.getList(this.page, this.pageSize).then(res => {
					if (res.code == 0) {
						this.list = res.data.data;
						uni.stopPullDownRefresh()
						this.page++
					}
				});
			},
			getMoreList() {
				this.loadingText = '-- 正在加载 --'
				this.$agreementApi.getList(this.page, this.pageSize).then(res => {
					if (res.code == 0) {
						if (res.data.data.length == 0 || res.data.data == null) {
							this.loadingText = '-- 暂无更多 --'
							return false;
						}
						var newlist = res.data.data;
						this.list = this.list.concat(newlist)
						this.page++
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.loadingText {
		padding: 20rpx 0 40rpx 0;
		text-align: center;
		color: #310D05;
		font-size: 28rpx;
	}
</style>
————————————————
版权声明：本文为CSDN博主「起早贪黑打工人」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_43282898/article/details/110119314

另一种实现方式，要后台接口返回是否是最后一页；

onReachBottom() {//页面触底时
	if (this.isBottom) {
		this.info();
	}
},
methods: {
	info() {
		// 请求后台接口。。。
		if (res.status == 200) {
			if (res.data.length == 0) {
				this.list = [];
			}
			if (res.isLastPage) { //如果是最后一页，则不再请求接口
				this.isBottom = false;
			} else {
				this.pageNum++;
			}
			if (res.data.length > 0) {
				this.list = this.list.concat(res.data);
			}
		}
	}
}
————————————————
版权声明：本文为CSDN博主「起早贪黑打工人」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_43282898/article/details/110119314