小程序 onReachBottom 上拉加载事件失效

微信自带的下拉刷新上拉加载需要在 .json 文件里打开

"enablePullDownRefresh": true

在 .js 文件中分别对应两个事件

 /*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {console.log('pull down refresh')},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {console.log('reach bottom')},

我在配置完成后发现下拉刷新可以出发，但是上拉加载触发不了，

罪魁祸首是我的 css 配置了 height:100%;

.content {/* height: 100%; */width: 100%;overflow: auto;
}

切记 height 不要设置为 100%

此外如果你需要自定义上拉加载的距离以达到类似于无缝加载的效果，可以在 .json 文件里配置

"onReachBottomDistance":50,

其中 50 就是出发距离，改为自己需要的值即可

小程序 onReachBottom 上拉加载事件失效相关推荐

小程序的上拉加载功能
小程序页面上拉加载步骤首先,在需要实现的页面js文件中,创建一个获取请求数据的方法: getdata(bool){let _this = thiswx.showLoading({title: '加载 ...
微信小程序scroll-view上拉加载更多
微信小程序scroll-view上拉加载更多 1.wxml代码 <scroll-view class="scroll-view-container" scroll-ybind ...
微信小程序如何上拉加载下一页
变量 data: {videos: [],page: 1,pageSize: 8,isLastPage: false,tips: '上拉加载更多' }, videos 数据容器 page 当前页数 p ...
小程序解决上拉加载更多时数据超过1024KB
参考: 如果解决小程序1024kb渲染之坑小程序渲染数据超过 1024k 的解决办法新手不会用组件,只能自己再弄一个简单一点的解决,直接上代码. app.js // arr 数组,len 长度, ...
uniapp微信小程序uni-load-more上拉加载更多数据
1.引入uni-app中uni-load-more.vue到自己的项目 import uniLoadMore from '@/components/uni-load-more/uni-load-mor ...
uniapp小程序实现上拉加载更多
废话不多说直接上代码,对了这里的上拉组件使用的是uniapp自带的组件uni-load-more <template><view><view v-for="(i ...
小程序（上拉加载更多数据）
小程序部分首先设置三个用到的初始值:page数据当前页数.limit当前页面几条数据.hasMoreData上拉时是否继续请求数据,即是否还有更多数据,别的就可以参考下面的代码了小程序代码 // ...
微信小程序实现上拉加载更多数据（分页加载）
前言: 该实例和我其他两篇文章息息相关,不清楚的可以先做功课 Vant Weapp小程序 UI 组件库 https://blog.csdn.net/qq_36303853/article/detail ...
【微信小程序】上拉触底事件
上拉触底手指在屏幕上的上拉滑动操作从而加载更多数据页面上拉触底事件触发时距页面的距离默认50px (滚动条距离底部的距离自动加载更多数据)"onReachBottomDistanc ...

小程序 onReachBottom 上拉加载事件失效

小程序 onReachBottom 上拉加载事件失效相关推荐

最新文章

热门文章