微信小程序上拉触底事件函数onReachBottom不触发的解决方案

这篇具有很好参考价值的文章主要介绍了微信小程序上拉触底事件函数onReachBottom不触发的解决方案。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

造成不触发的原因可能有以下几种情况

  • 配置属性问题
  • 高度问题
  • 滚动条不在顶部 需要回到顶部重新计算高度
  • onReachBottom函数被覆盖

1.配置属性问题

在app.json或者本页的json文件中配置onReachBottomDistance属性,区别在于全局还是只在本页生效

2.高度问题

//设置容器高度为100%
page{
  height: 100%
}

3. 切换页面时 滚动条滚回到顶部

//切换页面时调用API
wx.pageScrollTo({
  scrollTop: 0
})

4.onReachBottom()函数被覆盖

每个页的js文件创建时自带onReachBottom函数 不需要自己单独写

我的博客即将同步至腾讯云开发者社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan?invite_code=3a49jydatjmss文章来源地址https://www.toymoban.com/news/detail-509726.html

到了这里,关于微信小程序上拉触底事件函数onReachBottom不触发的解决方案的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序——页面事件,.启用下拉刷新监听页面的下拉刷新事件,上拉触底事件,停止下拉刷新的效果

    下拉刷新是移动端的专有名词,指的是通过手指在屏幕上的下拉滑动操作,从而重新加载页面数据的行为。 启用下拉刷新有两种方式: a.全局开启下拉刷新 在 app.json 的window 节点中,将 enablePullDownRefresh 设置为 true. b.局部开启下拉刷新 在页面的.json 配置文件中,将 enablePull

    2024年01月25日
    浏览(55)
  • 小程序onReachBottom上拉触底/下拉刷新没有反应问题(日常踩坑)

    今天踩了一个坑,因为改之前同事写的页面,新功能需要用到上拉刷新获取更多数据,当我加上onReachBottom时不管怎么上拉都没有效果后来发现给了整个页面固定高度,这就导致onReachBottom不触发了,其实还有很多导致onReachBottom不触发的,比如使用scroll-view处理不当也会导致o

    2024年02月03日
    浏览(39)
  • 小程序--下拉刷新/上拉触底

    一、什么是下拉刷新 下拉刷新 是移动端的专有名词,是指通过手指在屏幕上的下拉滑动操作,从而 重新加载页面数据 的行为 二、如何开启下拉刷新 ①全局开启下拉刷新 在app.json的windows节点中,将enablePullDownRefresh设置为true ②局部开启下拉刷新 在页面的.json配置文件中,将

    2024年02月14日
    浏览(45)
  • web之移动端实现触底和触顶功能、微信小程序、置顶、置底、触发、uniApp、onReachBottom、onPageScroll

    触底 onReachBottom 监听用户上拉触底事件。 可以在 app.json 的 window 选项中或页面配置中设置触发距离 onReachBottomDistance 。 在触发距离内滑动期间,本事件只会被触发一次。 触顶事件 onPageScroll(Object object) 监听用户滑动页面事件。 参数 Object object 的属性为 scrollTop ;类型为 Numb

    2024年02月16日
    浏览(36)
  • 微信小程序onReachBottom事件使用

    在微信小程序中,onReachBottom事件用于监听页面滚动到页面底部的时候触发的事件。当用户滑动页面到底部时,可以通过监听该事件来执行相应的操作。 要使用onReachBottom事件,需要在对应的页面或组件中定义一个函数,并在Page或Component的生命周期函数中注册该事件。 下面是

    2024年02月08日
    浏览(35)
  • #Uniapp: onReachBottom页面触底的事件回调

    onReachBottom页面触底的事件回调 定义 页面上拉触底事件触发时距页面底部距离,单位只支持px,详见页面生命周期 可在pages.json里定义具体页面底部的触发距离onReachBottomDistance, 比如设为50,那么滚动页面到距离底部50px时,就会触发onReachBottom事件。 如使用scroll-view导致页面没

    2024年01月23日
    浏览(34)
  • 微信小程序下拉刷新获取数据和触底事件刷新实现

    说明:开启下拉刷新,然后设置窗口的背景色,方便观看。   说明:重新发起请求,并显示加载中   说明:当数据请求成功后,收回下拉刷新框并关闭加载中。 说明: onReachBottomDistance 定义了从页面底部的距离为50px,当滚动距离接近到这个值时,通常会触发一个函数或事件

    2024年02月16日
    浏览(43)
  • 微信小程序无法触发onReachBottom的解决方案

    商品数据过多时,一页数据展示不完全。在浏览商品到触发底部的时候,需要加载新的商品数据。 无法触发onReachBottom的事件 onReachBottom 方法重复 删除系统自动生成的该方法

    2024年02月14日
    浏览(31)
  • 微信小程序——input事件处理函数

    在小程序中,通过input事件来响应文本框的输入事件,语法格式如下: 1、通过bindinput,可以为文本框绑定输入时间: 2、在页面中的.js文件中定义事件处理函数: 3、输入对比 4、输出对比:每一次按键输入都作为一次完整的文本出入并记录,当再有更新时,在后面自动键入或

    2024年02月04日
    浏览(36)
  • uni-app 微信小程序 onReachBottom 不生效

    问题描述: uni-app 微信小程序,页面滑到底部,onReachBottom 没有生效 代码: pages.json 配置 使用 onReachBottom 的页面: 总结: 最外层容器设置 min-height: 100.1vh

    2024年02月07日
    浏览(52)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包