小程序
小游戏
企业微信
微信支付
扫描小程序码分享
在swiper中只触发一次onReachBottom，必须回到顶部再滑到底部才能再一次触发onReachBottom，这问题什么时候解决？？？？
4 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
这个问题是swiper跟onreachBottom同时出现产生的
只触发一次是因为你的高度是设定死的，并不是必须回到顶部才触发第二次，而是回到第一次触发的高度，你可能用了wx.getSystemInfo里的windowheight来赋值高度，但第一次触发的时候并没有再次设置，所以需要上滑到顶部。举个例子：就是第一次设置400，到达400触发了你在滑到底部，其实你已经到达800了，但是onreachBottom还是认为400是底，所以到400才触发，解决问题的关键就是要在触发的时候在设定高度。
可能你设定完成后底部可以加载了，但是页面乱了，加载完需要上啦，然后才能看到滑动条，如图，其实这页有两个高度swiper和scroll-view，出现这个问题的原因是两个页面高度不统一，解决办法，设置成联动的，算好swiper的高度。如：
<swiper class="swiper-box" duration="300" style="height:{{winHeight}}px" bindchange="bindChange">
<swiper-item>
<scroll-view scroll-y="true" style="height: {{winHeight-15}}px">
style样式，这样就可以解决问题了
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
非常感谢您的回答，我用
<
swiper
>
swiper-item
scroll-view
></
</
用scroll-view的bindscrolltolower（）事件代替nreachBottom（）效果一样；因为我的item是长页面，我也无法计算其高度（每个list高度不一致，根据接口数据显示），非常感谢。
使用scroll-view 向Y轴滑动 swiper的滑动就无效了
谢谢 参考了您的，我也使用了
你好 你的具体如何解决的 可以分享一下吗 我现在也遇到这个问题
方法1：swiper跟onreachBottom同时产生的话，默认的高度就是屏幕高度400，你上拉后还是400。需要你自己把页面高度设定成活动的，上拉的时候重新设定页面高度。例如第一次触发是屏幕高度400，第二次的时候加上你数据的高度,自己计算触发高度。style="height:{{winHeight}}px" 。
onReachBottom: function () 函数里设定winHeight
that.setData({
winHeight: that.data.winHeight + res.windowHeight
});
<view class='listBox'>
<scroll-view scroll-x="true" class="swiper-tab">
<view class="{{currentTab==index ? 'on' : ''}}" wx:for="{{navList}}" data-id="{{item.id}}" data-current="{{index}}" bindtap="swichNav">{{item.name}}</view>
</scroll-view>
<block wx:for='{{goodsList}}' wx:for-item="goods">
<navigator class='hot_con'>
<image src='{{goods.primary_pic_url}}?x-oss-process=image/interlace,1/format,jpg/quality,q_60' mode='widthFix'></image>
<view class='hot_words'>
<text>{{goods.name}}</text>
<text></text>
</view>
<view class='hot_price'>
<text>￥{{goods.market_price}}</text>
<label></label>
</navigator>
</block>
</swiper-item>
</swiper>
但是我现在的问题的 onReachBottom不触发 一次都没有 很难受
内容是这样的
<swiper vertical="true" style="height:{{winHeight}}px" current="{{ currentOutSide }}" duration="300" bindchange="changeSwiper">
<block>
<swiper-item wx:key="unique" wx:for="{{ recommendList }}" wx:for-index="idx" wx:for-item="item">
<swiper class="swiper-box {{ item.images.length > 1?'':'hideDot' }}" style="height:{{winHeight}}px" current="{{ currentPic }}" indicator-dots="true">
<swiper-item class="swiper-box-item" wx:key="unique" wx:for="{{ item.images }}" wx:for-index="img-idx" wx:for-item="imgItem">
<image lazy-load="true" mode='aspectFit' src='{{ imgItem.imageUrl }}'></image>
这样就划不动了
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
这个问题是swiper跟onreachBottom同时出现产生的
只触发一次是因为你的高度是设定死的，并不是必须回到顶部才触发第二次，而是回到第一次触发的高度，你可能用了wx.getSystemInfo里的windowheight来赋值高度，但第一次触发的时候并没有再次设置，所以需要上滑到顶部。举个例子：就是第一次设置400，到达400触发了你在滑到底部，其实你已经到达800了，但是onreachBottom还是认为400是底，所以到400才触发，解决问题的关键就是要在触发的时候在设定高度。
可能你设定完成后底部可以加载了，但是页面乱了，加载完需要上啦，然后才能看到滑动条，如图![]()
，其实这页有两个高度swiper和scroll-view，出现这个问题的原因是两个页面高度不统一，解决办法，设置成联动的，算好swiper的高度。如：
<swiper class="swiper-box" duration="300" style="height:{{winHeight}}px" bindchange="bindChange">
<swiper-item>
<scroll-view scroll-y="true" style="height: {{winHeight-15}}px">
style样式，这样就可以解决问题了
非常感谢您的回答，我用
<swiper><swiper-item><scroll-view></scroll-view></swiper-item></swiper>用scroll-view的bindscrolltolower（）事件代替nreachBottom（）效果一样；因为我的item是长页面，我也无法计算其高度（每个list高度不一致，根据接口数据显示），非常感谢。
使用scroll-view 向Y轴滑动 swiper的滑动就无效了![]()
谢谢 参考了您的，我也使用了
bindscrolltolower（）事件代替nreachBottom（）你好 你的具体如何解决的 可以分享一下吗 我现在也遇到这个问题
方法1：swiper跟onreachBottom同时产生的话，默认的高度就是屏幕高度400，你上拉后还是400。需要你自己把页面高度设定成活动的，上拉的时候重新设定页面高度。例如第一次触发是屏幕高度400，第二次的时候加上你数据的高度,自己计算触发高度。style="height:{{winHeight}}px" 。
JS文件里自己定义winHeight，onReachBottom: function () 函数里设定winHeight
that.setData({
winHeight: that.data.winHeight + res.windowHeight
});
方法2：参考看第一场雪的，用另一种方法写<view class='listBox'>
<scroll-view scroll-x="true" class="swiper-tab">
<view class="{{currentTab==index ? 'on' : ''}}" wx:for="{{navList}}" data-id="{{item.id}}" data-current="{{index}}" bindtap="swichNav">{{item.name}}</view>
</scroll-view>
<swiper class="swiper-box" duration="300" style="height:{{winHeight}}px" bindchange="bindChange">
<swiper-item>
<scroll-view scroll-y="true" style="height: {{winHeight-15}}px">
<block wx:for='{{goodsList}}' wx:for-item="goods">
<navigator class='hot_con'>
<image src='{{goods.primary_pic_url}}?x-oss-process=image/interlace,1/format,jpg/quality,q_60' mode='widthFix'></image>
<view class='hot_words'>
<text>{{goods.name}}</text>
<text></text>
</view>
<view class='hot_price'>
<text>￥{{goods.market_price}}</text>
<label></label>
</view>
</navigator>
</block>
</scroll-view>
</swiper-item>
</swiper>
</view>
但是我现在的问题的 onReachBottom不触发 一次都没有 很难受
内容是这样的![]()
<swiper vertical="true" style="height:{{winHeight}}px" current="{{ currentOutSide }}" duration="300" bindchange="changeSwiper">
<block>
<swiper-item wx:key="unique" wx:for="{{ recommendList }}" wx:for-index="idx" wx:for-item="item">
<scroll-view scroll-y="true" style="height: {{winHeight-15}}px">
<swiper class="swiper-box {{ item.images.length > 1?'':'hideDot' }}" style="height:{{winHeight}}px" current="{{ currentPic }}" indicator-dots="true">
<block>
<swiper-item class="swiper-box-item" wx:key="unique" wx:for="{{ item.images }}" wx:for-index="img-idx" wx:for-item="imgItem">
<image lazy-load="true" mode='aspectFit' src='{{ imgItem.imageUrl }}'></image>
</swiper-item>
</block>
</swiper>
</scroll-view>
</swiper-item>
</block>
</swiper>
这样就划不动了
非常感谢您的回答，我用
<swiper><swiper-item><scroll-view></scroll-view></swiper-item></swiper>用scroll-view的bindscrolltolower（）事件代替nreachBottom（）效果一样；因为我的item是长页面，我也无法计算其高度（每个list高度不一致，根据接口数据显示），非常感谢。
使用scroll-view 向Y轴滑动 swiper的滑动就无效了![]()