uni-app下拉刷新 和 上拉加载

<template>
	<view class="index-container">
		<view class="container-item" v-for="(item,index) in shopList" :key="item.id">
			<image class="item-pic" :src="item.images[0]" mode=""></image>
			<text>{{item.name}}</text>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				query:{},
				shopList:[],
				page:1,
				pageSize:10,
				total:0,
				isloading:false, //节流阀
			}
		},
		onLoad(options) {
			// this.query = options
			this.query = {id:1,name:'文字'}
			this.getShopData();
		},
		methods:{
			getShopData(cb) {
				this.isloading = true
				uni.showLoading({
					title: '数据加载中..'
				});
				uni.request({
					url:`https://www.escook.cn/categories/${this.query.id}/shops`,
					method:"GET",
					data:{
						_page:this.page,
						_limit:this.pageSize
					},
					success: (res) => {
						this.shopList = [...this.shopList,...res.data]
						this.total = res.header['X-Total-Count'] - 0
					},
					complete: () => {
						uni.hideLoading();
						this.isloading = false
						cb && cb()
					}
				})
			}
		},
		// 触底加载下一页
		onReachBottom() {
			// 判断是否有下一页数据  页码值*每页显示多少条数据>= 总数据
			if(this.page * this.pageSize >= this.total) {
				return uni.showToast({
					title:'没有数据了',
					icon:"none"
				})
			}
			if(this.isloading) return
			this.page++;
			this.getShopData();
		},
		// 下拉刷新数据
		onPullDownRefresh() {
			this.shopList = [];
			this.page = 1
			this.total = 0
			this.getShopData(()=> {
				uni.stopPullDownRefresh();
			})
		},
	}
</script>
<style lang="less">
.index-container{
	.container-item {
		padding: 20rpx;
		margin: 20rpx;
		border-radius: 20rpx;
		background-color: #efefef;
		.item-pic {
			width: 160rpx;
			height: 160rpx;
		}
	}
}
</style>