onReachBottom开发者工具(v1.01.1711300)上只能触发一次
< view class = "reciter-container container" > < view class = "tab-bar" > < view class = "tab-bar-left" > </ view > < view bindtap = "switchTab" data-index = "{{item.index}}" class = "{{(tab.current == item.index) ? 'tab-bar-item-current' : ''}} tab-bar-item" wx:for-items = "{{tabs}}" wx:key = "{{index}}" > {{item.display}} </ view > < view class = "tab-bar-query" > </ view > </ view > < view class = "reciter-content" scroll-y = "{{true}}" > < view class = "reciter-content-main" > < view style = "width: 100px;" wx:for-items = "{{reciterList}}" wx:key = "{{index}}" >{{item.name}}</ view > </ view > </ view > </ view > |
Page({ data: { tabs: [{index: 0, display: '朗诵' }, {index: 1, display: '诗词' }, {index: 2, display: '比赛' }], tab: { current: 0 }, reciterList: [], }, onPullDownRefresh: function () { console.log( 'onPullDownRefresh' ); wx.showNavigationBarLoading(); setTimeout(() => {wx.stopPullDownRefresh(); console.log( 'stopPullDownRefresh' ); wx.hideNavigationBarLoading()}, 3000) }, onReachBottom: function () { console.log( 'onReachBottom' ); this .setData({reciterList: this .data.reciterList.concat([{name: 'a' }])}); }, onShow: function () { console.log( 'onShow' ); }, switchTab: function (e) { this .setData({ tab: { current: e.currentTarget.dataset.index } }); }, fetchData: function () { } }) |
{ "usingComponents" : { "list-item" : "../components/list_item/index" }, "enablePullDownRefresh" : true , "onReachBottomDistance" : 50 } |
事件在开发者工具和手机上都只能触发一次,正常么?如何触发多次?
5 回复
< view class = "reciter-content" scroll-y = "{{true}}" > |
view也有scroll-y属性吗,不是scroll-view才有吗?
用了scroll-view之后onReachBottom是只会触发一次的。
我觉得scroll-view最大的问题是不能放<video>标签,好像是因为<video>标签不能放在包含overflow: auto的父容器内。overflow: visible倒没问题。
另外就是scroll-view没有明显的下拉动画,感觉有点奇怪。
另外
< view class = "layout" > < view class = "layout-header" > </ view > < view class = "home-content" > <!-- <view class="home"> <scroll-view scroll-y enable-back-to-top scroll-with-animation bindscrolltolower="loadMore" class="scroll-view"> <audio-background show="{{ show }}"></audio-background> <view class="list"> <block wx:for="{{ items }}" wx:for-index="index" wx:for-item="item" wx:key="id"> <item item="{{ item }}"></item> </block> </view> </scroll-view> --> < view class = "home" > < audio-background show = "{{ show }}" ></ audio-background > < view class = "list" > < block wx:for = "{{ items }}" wx:for-index = "index" wx:for-item = "item" wx:key = "id" > < item item = "{{ item }}" index = "{{ index }}" ></ item > </ block > </ view > </ view > </ view > < view class = "layout-footer" ></ view > </ view > |
.layout { position : absolute ; top : 0 ; right : 0 ; bottom : 0 ; left : 0 ; height : 100% ; width : 100% ; display : flex; flex- direction : column; flex-shrink: 0 ; } .home-content { display : flex; flex: 1 1 auto ; overflow : visible ; position : relative ; } |
我是这样写的,可以触发多次。看不出来你的bug出在哪