onPullDownRefresh 上拉触底不执行 小程序

最新推荐文章于 2023-04-11 17:26:29 发布
最新推荐文章于 2023-04-11 17:26:29 发布
阅读量1.1k 收藏
点赞数
分类专栏： 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xieting153/article/details/99406983
版权

“enablePullDownRefresh”: true 用在对应的json文件中，而不是用在app.json中。
函数名不能重复，小程序自动会生成一个onPullDownRefresh

微信小程序 - 最新详细实现列表上拉懒加载及“到底了“功能示例，数据列表下拉滑动页面触底后请求接口懒加载数据，自动计算分页/总条数、判断分页懒加载是否继续请求接口数据，以及数据没有了底部提示用户没有了
王佳斌
08-18 4021
微信小程序，vue2，vue3，列表，懒加载，触底加载，上拉页面触发加载，列表懒加载如何判断是否还需要继续请求接口，如何知道数据加载已经没有了停止继续请求，分页判断，列表滚动触底更新实现，页面滚动到底部后请求数据填充到data中，小程序上拉加载和下拉刷新，如何分页加载数据，实现上拉加载功能示例加载更多数据/触底加载/点击加载更多数据，数据分页请求，onReachBottom()，不生效，不触发的情况，列表下拉加载判断是否到底了，我是有底线的，到底啦，自动计算，用户滑动屏幕加载数据功能，滚动条触底，如何通过小
微信小程序 - 页面触底 onReachBottom() 懒加载自动计算分页、检查是否已经请求完全部数据、自动请求接口合并数据（高效自动判断分页懒加载是否继续请求接口数据，超详细触底请求后端示例教程）
王佳斌
10-07 2832
微信小程序，vue2，vue3，列表，懒加载，触底加载，上拉页面触发加载，列表懒加载如何判断是否还需要继续请求接口，如何知道数据加载已经没有了停止继续请求，分页判断，列表滚动触底更新实现，页面滚动到底部后请求数据填充到data中，小程序上拉加载和下拉刷新，如何分页加载数据，实现上拉加载功能示例加载更多数据/触底加载/点击加载更多数据，数据分页请求，onReachBottom()，不生效，不触发的情况，列表下拉加载判断是否到底了，我是有底线的，到底啦，自动计算，用户滑动屏幕加载数据功能，滚动条触底，如何通过小
uni-app下拉框实现
12-18
uni-app下拉框实现，纯原生写法
onPullDownRefresh函数没有被正确执行
weixin_30737433的博客
11-06 260
原因 问题原因很多，我遇到的这个问题的原因是： 页面有两个同名的onPullDownRefresh函数，导致只执行最后的一个。 解决 只留一个onPullDownRefresh函数 转载于:https://www.cnblogs.com/Zev_Fung/p/9913258.html...
小程序 钩子函数onPullDownRefresh不执行
m0_73461567的博客
02-02 416
在pages.json中配置了"enablePullDownRefresh": true后，页面组件的enablePullDownRefresh钩子函数不执行，也不会报错。解决1：onPullDownRefresh钩子函数和methods是同级，注意位置。
uniapp下拉置顶
weixin_44952708的博客
05-17 846
onLoad() { let that = this // 获取当前dom与顶部之间的距离 const query = uni.createSelectorQuery() query.select('#delicacy').boundingClientRect() query.exec(function(res){ that.menuTop = res[0].top }) }, // 监听滚动 onPageScroll(.
uniapp的onPullDownRefresh失效 不执行
starstarstarl的博客
04-11 2083
里，找到的当前页面的pages节点，并在。
微信小程序 scroll-view实现上拉加载与下拉刷新的实例
11-26
在微信小程序中，`scroll-view`组件是用于实现滚动效果的重要元素，它可以处理横向或纵向的滚动，并且支持上拉加载更多（onReachBottom）和下拉刷新（onPullDownRefresh）功能。以下是对实现这一功能的代码进行的...
【微信小程序】：分页请求数据、上拉加载、下拉刷新。
m0_55546349的博客
07-18 1081
微信小程序：分页请求数据、上拉加载、下拉刷新。
微信小程序个人中心、我的界面+源码（示例一）
04-26
- `onPullDownRefresh`、`onReachBottom` 分别处理用户下拉刷新和页面上拉触底的事件。 - `onShareAppMessage` 用于自定义用户分享应用时的内容。 通过这个示例，初学者可以学习到如何在微信小程序中创建个人中心...
微信小程序--onPullDownRefresh()函数不起作用
海到无边天作岸 山登绝顶我为峰
11-09 3148
onPullDownRefresh()函数不起作用 解决方案 json文件添加enablePullDownRefresh、onReachBottomDistance 注：系统一般会自己生成onPullDownRefresh，所以很有可能自己一不小心会再写一个onPullDownRefresh函数，同样也会造成该函数不起作用 { "enablePullDownRefresh":true, "...
小程序 onReachBottom 上拉加载事件失效
Young_Gao的博客
01-14 1万+
微信自带的下拉刷新上拉加载需要在 .json 文件里打开 "enablePullDownRefresh": true 在 .js 文件中分别对应两个事件  /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { console.log('pull down refresh') }, ...
微信小程序：onReachBottom(),onPullDownRefresh()事件不触发的原因
Queen-Shir的博客
11-29 6898
onReachBottom()下拉触顶： 原因：页面上的内容没有超出文档的高度，当前页面没有滚动条，就不会触发上拉触底事件。上拉不了就不会触底。 此时可以用滚动监听事件代替。 onPageScroll:function(e){ console.log(e.scrollTop); if (e.scrollTop>=92){ ...... } ...
uni-app顶部导航栏 下拉滑动固定到屏幕顶部
小猫爪子
11-24 3990
示例图片 代码 <template> <view style="display: flex;flex: row; position:fixed; left: 0; width: 100%; top: 30;z-index: 999;"> <scroll-view scroll-x class="bg-white nav" scroll-with-animation :scroll-left="scrollLeft"> <view class="cu-i
微信小程序上拉刷新和下拉加载2种方法实现，onPullDownRefresh，scroll-view使用
热门推荐
橙-极纪元-cplvfx-JJY.Cheng
10-26 2万+
这篇文章，直接开怼，代码有详细注释 onPullDownRefresh实现下拉刷新  一、获取数据 //product2获取数据 loadProduct2: function () { var that = this; wx.request(OBJECT)//发起网络请求。使用前请先阅读说明。 }, 二、下拉调用
uniapp下拉框
weixin_45098257的博客
06-01 7618
下面的label-key=是下来框显示的内容，value-key是传到后台的key <view class="vid2_1">视频</view> <ld-select class="vid2_2" :list="list" label-key="waterWorkName" value-key="url" v-model="select" placeholder="请选择" clearable
uniapp 下拉框
长春小佛爷的博客
10-15 5587
{{index==-1?'--请选择--':cou
uniapp-select 下拉框
qq_45243261的博客
05-25 9268
目前uniapp下拉框中比较友好的,功能比较完善 链接:superwei-combox 组合框 - DCloud 插件市场 下拉搜索选择组合框，基于官方uni-combox组件，解决选择后再次选择不展示全部选项的问题，支持模糊搜索和JSON数组格式，可设置选中项文字和背景颜色（若使用请一定下载uni_modules版本）https://ext.dcloud.net.cn/plugin?id=7520 ...
uniapp下拉框组件
WeiflR10的博客
09-20 6728
之前写过一个小程序的，引入单个下拉框是没有问题的，但是一个页面引入多个下拉框组件的话就会有bug，比如可以同时展开多个下拉框的问题，在此修复了。如果大家有什么好的办法可以告诉我一下嘛~如果想在js中输出this.isjiantou0 this.isjiantou1 this.isjiantou2 ...，可以使用模板字符串。
简述微信小程序如何实现上拉触底。
最新发布
10-12
微信小程序实现上拉加载更多（也称为无限滚动或下拉刷新）通常通过监听`scrollertolower`事件来完成。这个过程包括以下几个步骤： 1. **设置滚动区域**: 首先，你需要在需要实现上拉触底的地方添加一个`scroll-view`组件，并给它设置`bindscrolltolower`属性，当滚动到底部时触发该事件。 ```html <view scroll-y="true" bindscrolltolower="loadMoreData"> <!-- 其他内容 --> </view> ``` 2. **注册事件处理函数**: 在对应的WXML文件的js部分，定义`loadMoreData`函数，该函数会在用户滚动到底部时被调用。 ```javascript Page({ data: { // ... }, loadMoreData: function(e) { if (e.detail.scrollTop === this.data.scrollHeight) { // 加载更多的数据 this.setData({ isLoading: true }); setTimeout(() => { this.setData({ loadingData: '正在加载...', isLoading: false }); // 模拟异步加载，替换为实际加载数据的API调用 }, 2000); } }, // ... }) ``` 在这个例子中，当滚动到底部时，会进入`loadMoreData`函数，检查是否到达了可视区底部（`scrollTop`等于`scrollHeight`）。如果到达，就会显示一个加载动画，然后模拟延迟数据加载。 3. **状态管理**: 为了防止多次无谓的请求，通常会设置一个标志`isLoading`或类似的状态，只有在用户真正上拉到最底部并且不是首次加载时才会发送新的请求。 4. **结束加载提示**: 当数据加载完毕后，更新界面并清除加载标志，提示用户已加载完所有数据。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值