onReachBottom开发者工具(v1.01.1711300)上只能触发一次
发布于 6 年前 作者 ming12 17904 次浏览 来自 问答
<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,结果发现炒鸡难用,还麻烦。就切回他们官方提供的上拉和下拉刷新了。结果,,,就出现了我说的这个bug

我觉得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出在哪

把那个属性去掉了使用view也只能触发一次

你好,问题已复现,我们会在后续版本中进行修复。

回到顶部