uni-app 微信小程序 onReachBottom 不生效

叶子_o

已于 2023-07-14 14:09:59 修改

阅读量1.8k

点赞数 1

文章标签： uni-app 微信小程序

于 2023-06-28 16:38:32 首次发布

本文链接：https://blog.csdn.net/xiamoziqian/article/details/131440059

版权

在uni-app中开发微信小程序时，遇到onReachBottom事件无法正常触发的问题。页面配置中设置了onReachBottomDistance为100，页面最外层容器使用了min-height:100.1vh，并设置了overflow-y:scroll，但滑动到底部时事件未生效。代码中引入并使用了onReachBottom方法，但可能的解决方案未在提供的代码段中显示。

摘要由CSDN通过智能技术生成

问题描述：
uni-app 微信小程序，页面滑到底部，onReachBottom 没有生效

代码：
pages.json 配置

{
  "path": "",
  "style": { 
    "navigationBarTitleText": "列表",
    "onReachBottomDistance": 100 // 重点
  }
}

使用 onReachBottom 的页面:

import { onReachBottom } from '@dcloudio/uni-app'

onReachBottom(() => {
  // 你的代码逻辑
  if (parameters.value.current >= pages.value) { return }
  parameters.value.current += 1
  toSearch.value()
})

<style lang="scss" scoped>
.container {
	min-height: 100.1vh; // 重点
	overflow-y: scroll;
}
</style>

总结：
最外层容器设置 min-height: 100.1vh