下拉刷新
<template> <view class="tabnav"> <scroll-view scroll-y="true" refresher-enabled="true" :refresher-triggered="refreshTrigged.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> </scroll-view> </view> </template> <script lang="ts" setup> import { reactive } from "vue"; const listorder = reactive<any>({ data: [], pageSize: 5, pageNum: 1, totalCount: 0, isLoading: false, hasMore: true, // 初始假设有更多数据 }); const refreshTrigged = reactive<any>({ freshbol: false, }); const refresherrefresh = () => { console.log('===================================='); console.log(refreshTrigged,"refreshTrigged"); console.log('===================================='); if (refreshTrigged.freshbol) { return; } refreshTrigged.freshbol = true; listorder.pageNum = 0; }; const loadingMore = () => { console.log("触底3333333333", listorder.hasMore); if (!listorder.hasMore) { return; } listorder.pageNum++; }; </script> <style scoped lang="scss"> </style>
本文来自博客园,作者:zjxgdq,转载请注明原文链接:https://www.cnblogs.com/zjxzhj/p/18295571