uniapp 下拉刷新和上拉加载更多

902 阅读1分钟

uniapp 下拉刷新和上拉加载更多实现代码,兼容小程序,H5,app,真机测试可用。

实现代码

1.在页面写这两方法,分别是下拉刷新和下拉触底的监听事件

		// 下拉刷新
		onPullDownRefresh() {
			console.log('下拉刷新')
			setTimeout(() => {
				console.log('下拉刷新停止')
				uni.stopPullDownRefresh()
			},5500)
		},
		// 上拉加载
		onReachBottom() {
			console.log('上拉加载')
			setTimeout(() => {
				console.log('上拉加载停止')
				uni.stopPullDownRefresh()
			},5500)
		},

2.在pages.json里面的页面配置这个页面的 style 属性,下面的是上拉触底的距离;

代码如下 

                "enablePullDownRefresh": true,
				"onReachBottomDistance":50