uniapp-vue下拉刷新上拉加载

<template>
	<!-- 上拉刷新下拉加 -->
	<view class="tabnav">
		<u-loading-page bgColor="rgba(0, 0, 0, 0.4)" :loading="loading" ></u-loading-page>
		<scroll-view style="height:100vh" :scroll-y="true" :refresher-enabled="true" :refresher-triggered="freshbol"
			@refresherrefresh="refresherrefresh" refresher-background="#f6f6f6" lower-threshold="60"
			@scrolltolower="loadingMore" class="listArea">
			
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
			<view style="border: 1px solid red; height: 200rpx;">打打巅峰</view>
		</scroll-view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			freshbol: false,
			loading:true,
			data: [],
			pageSize: 5,
			pageNum: 1,
			totalCount: 0,
			isLoading: false,
			hasMore: true, // 初始假设有更多数据
		}
	},
	methods: {
		refresherrefresh() {
			console.log("shang 3333333333", this.hasMore);
			if (this.freshbol) {
				return;
			}
			this.pageNum = 0;
				this.freshbol = true
			setTimeout(() => {
				this.freshbol = false
				uni.stopPullDownRefresh(); // 关闭下拉刷新动画
			}, 1000);
		},
		loadingMore() {
			console.log("触底3333333333", this.hasMore);
			if (!this.hasMore) {
				return;
			}
			this.pageNum++;
		}
	}
}
</script>

<style scoped lang="scss"></style>

  

posted @ 2025-06-26 11:31  zjxgdq  阅读(10)  评论(0)    收藏  举报