上拉刷新下拉抵触

最新推荐文章于 2025-08-20 18:23:08 发布

原创最新推荐文章于 2025-08-20 18:23:08 发布 · 364 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js #javascript #微信小程序

uniapp 同时被 3 个专栏收录

44 篇文章

订阅专栏

40 篇文章

订阅专栏

微信小程序

27 篇文章

订阅专栏

这段代码展示了在uni-app中实现下拉刷新和上拉加载的方法。`onPullDownRefresh`函数用于处理下拉刷新事件，重置页码并清空商品列表，然后重新初始化数据并设置延迟停止下拉刷新的计时器。`onReachBottom`函数处理上拉加载更多事件，调用`init`方法加载更多数据。在`init`方法中，发送POST请求获取商品列表，并更新页码，处理返回的数据并将其追加到商品列表。

	onPullDownRefresh() {
		      this.page = 1;
		      this.shopList = []
		      this.init()
		       setTimeout(function () {
		           uni.stopPullDownRefresh();
		       }, 1000);
		},
		onReachBottom() {
			let that = this;
			
			that.init();
		},
	methods: {



			init() {
				let _this = this
				uni.request({
					url: this.global.url + '/api/task/merchant',
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					data: {
						page: _this.page,
						token: uni.getStorageSync('token').token
					},
					success: (res) => {
						let list = res.data.data.data;
						if (list.length) {
							_this.page += 1;
							for (let a in list) {
								list[a].avatar = _this.global.url + list[a].avatar
								_this.shopList.push(list[a])
							}
							console.log(this.shopList)
						}
					}
				})
			},
}