onReachBottom不起效【已解决】

最新推荐文章于 2024-05-06 15:50:42 发布
最新推荐文章于 2024-05-06 15:50:42 发布
阅读量1w 收藏 4
点赞数 9
分类专栏： uniapp
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44977477/article/details/104924766
版权

onReachBottom

废话不多说，本人的原因是溢出滚动的view设置了height，去掉即可（高度撑出来）

我设置的height为100%；检测不到onReachBottom，

在网上看了一些其他人的BUG

1. json中配置 “onReachBottomDistance”:50，（这个可能性不大，基本可以忽略）
在这里插入图片描述
2.下面写了相同的方法，将上的事件覆盖了
3.不能和scroll-view同时使用
4.滚动条在原位置，需要滚回顶部，重新计算高度

Jarvis Downey
关注
  • 9
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
onReachBottom不生效的原因（再骂自己一次）
weixin_53465412的博客
03-15 3520
onReachBottom和onPageScroll不生效，和普罗大众不一样的错法（55555555）
uni-app无法触发onReachBottom触底事件的解决方案
Esther_liew的博客
11-28 4722
uni-app在开发小程序时，无法触发onReachBottom触底函数，排除了页面配置/容器高度等问题，发现是容器设置了定位
解决uni-app滚动到底部自动更新的问题
最新发布
qq_57477371的博客
05-06 250
再提一下，如果是子组件里的内容需要换页，可以在父组件调用onReachBottom()生命周期，再使用 this.$refs.方法() 来调用子组件的换页事件，因为直接在子组件调用onReachBottom()，可能不生效。onReachBottom()是uni-app的一个小的生命周期，他会在滑到底部时，自动触发，不需要下载插件，是uni-app自带的。在使用uni-app开发移动端项目时，经常会涉及到分页的情况，但是又不能像pc端那样，通过点击按钮进行换页，这样用户体验不够好。
onreachbottom不执行
qq_32220479的博客
05-03 1223
小程序onreachbottom不执行 原因主要有两个：1.设置了页面高度，导致只能加载当前页，去掉页面高度 2.页面在创建时会自动创建一个没有任何输出的onreachbottom方法，与你自己创建的onreachbottom方法重复，导致自己创的方法被覆盖，删除其中一个即可，建议在创建页面之后将暂时用不到的方法全部删除，避免发生错误！！！ ...
uniapp 解决onReachBottom失效
qq_43351090的博客
10-21 1万+
一、为什么失效？ 当给最外层view（container）设置overflow样式后，onReachBottom钩子不触发，去除overflow后，可触发，但存在某些样式问题。 .container{ height: 100vh; background-color: #F5F6FA; overflow: scroll; } 二、解决方案 1.去除overflow，直接修改page样式 page{ height: 100vh; background-color: #F5F6FA; }
小程序onReachBottom上拉触底/下拉刷新没有反应问题（日常踩坑）
pirs123的博客
07-11 2253
今天踩了一个坑，因为改之前同事写的页面，新功能需要用到上拉刷新获取更多数据，当我加上onReachBottom时不管怎么上拉都没有效果后来发现给了整个页面固定高度，这就导致onReachBottom不触发了，其实还有很多导致onReachBottom不触发的，比如使用scroll-view处理不当也会导致onReachBottom不执行。虽然onReachBottom是自带的方法但是一定要写在methods里面才会触发的噢。下面是去掉固定高度的效果，触发了！
【微信小程序页面出现onReachBottom不触发的情况】
没落的博客
03-06 1341
无法触发的原因是：height设置为100vh,会导致滑动不会触底。修改一下css就会触发。
uniapp页面不能触发onReachBottom事件
weixin_61728046的博客
10-27 4521
uniapp页面不能触发onReachBottom事件
小程序onreachbottom不执行
为啥不能换名字的博客
08-20 2万+
今天写一个列表页遇到一个问题  不管我怎么加载更多就是不触发onreachbottom这个触底事件 先说说页面布局吧 上边筛选条件定位的下边合计定位的 我中间列表 .list-box{ width:100%; height:80%; overflow-y:scroll; position:absolute; top:110rpx; } 解决方法：因为一句样式问题 去掉hei...
按钮无法点击 Do not have xx handler in current page，去掉BOM头的方法 ...
03-29
总的来说，解决“按钮无法点击”的问题，关键在于确保事件处理器已定义在页面中，并正确地与组件的事件绑定。同时，合理地使用`template`、`props`、`data`和组件的生命周期方法，可以有效地实现微信小程序的组件化...
微信小程序学习：下拉刷新上拉加载与弹窗的两种姿势
03-29
在js文件里直接重写"onPullDownRefresh"和"onReachBottom"方法即可； xml ......... js onPullDownRefresh: function() { // Do something when pull down. console.log('刷新'); }, onReachBottom: function() { ...
微信小程序实现列表下拉刷新上拉加载
08-28
微信小程序提供了onPullDownRefresh函数和onReachBottom函数这两个重要的监听函数，分别用于监听页面的下拉和上拉动态。onPullDownRefresh函数用于监听页面的下拉刷新事件，而onReachBottom函数用于监听页面的上拉...
微信小程序列表渲染功能之列表下拉刷新及上拉加载的实现方法分析
08-28
在编程时，需要考虑首次进入页面，如果页面不满一屏时会触发 onReachBottom ；手指上拉，会触发多次 onReachBottom，需要将这两点考虑在内。 微信小程序列表渲染功能之列表下拉刷新及上拉加载的实现方法有多种，...
智能小程序--四种方式快速实现上拉触底加载更多效果
03-29
使用 onReachBottom 实现 使用 scroll-view 组件实现 使用信息流模板实现上拉加载 使用 swiper 组件配合 onReachBottom 实现上拉加载 使用 onReachBottom 实现 智能小程序提供了 onReachBottom ，即页面上拉触底...
微信小程序 特殊布局下，页面上拉触底事件onReachBottom无法触发解决方法
zqhs5599的博客
07-10 2899
一、js import fn from '../../utils/functions.js'; // 你自己封装的方法集 Page({ data: { list: [], page: 1, loading: false, // 是否加载中 finished: false // 是否加载完毕 }, /** * 页面上拉触底事件的处理函数 */ scrollToLower: function(e) { if (!this.data.finish
微信小程序onReachBottom未触发
ARLENE2的博客
03-10 465
微信小程序onReachBottom未触发
onReachBottom没有触发？填坑之路
轻量开发
04-17 2057
最近搞微信小程序，遇到onReachBottom没有触发的问题。其他页面滑动到底部能触发onReachBottom。但是新搞的页面怎么设置都不行。百度各种方法都用上了。最后，我还是从引入组件排查。发现用<scroll-view/>就不会触发onReachBottom。经过查看api,发现此控件有自带的触发回调，bindscrolltolower就是触发底部回调的。
hooks taro 下拉刷新_进阶指南 - Hooks - 《Taro 2.0.1 使用文档》 - 书栈网 · BookStack...
weixin_39721009的博客
12-20 492
Hooks自 v1.3.0-beta-0 起支持Hooks 是一套全新的 API，可以让你在不编写类，不使用 state 的情况下使用 Class 的状态管理，生命周期等功能。关于 Hooks 的概述、动机和规则，我们强烈建议你阅读 React 的官方文档。和其它大部分 React 特性不同，Hooks 没有 RFC 介绍，相反，所有说明都在文档中：本篇文档只会介绍在 Taro 中可用的 Hook...
小程序分页加载onReachBottom上拉触底加载--小程序走过的坑（6）（最新版）
热门推荐
zhanxingdong的博客
07-26 6万+
onReachBottom 小程序拥有页面上拉触底事件的处理函数onReachBottom 当上拉至底部时就会触发onReachBottom函数来进行相应动作。也就是说小程序自带能捕捉到用户触底事件的函数。我们无需再进行捕捉用户事件了！！！ 直接上代码 data: { limit: 11,//显示数据量 list: '', page: 1,//当前页 ...
onreachbottom不触发
08-16
在使用onReachBottom函数时，可能会出现一些问题导致该函数不触发。首先，当给最外层view设置了overflow样式后，onReachBottom钩子将不会触发。解决方法是去除overflow样式。另外，如果底部没有预留足够的高度供滑动，也会导致onReachBottom不触发。解决方法是在底部添加一个空的view并设置合适的高度。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [uniapp 解决onReachBottom失效](https://blog.csdn.net/qq_43351090/article/details/120885192)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [onReachBottom无法触发也不报错](https://blog.csdn.net/qq_55928824/article/details/124458290)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [微信小程序上拉触底事件函数onReachBottom不触发的解决方案](https://blog.csdn.net/wohenshenmi/article/details/128372428)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值