持续调用Animation.translateY在真机上出现卡顿
发布于 5 年前 作者 qiaojie 8098 次浏览 来自 问答

    之前使用scroll-view实现组件内部的滚动，但是因为canvas导致不得不使用cover-view，但是cover-view中不支持scroll-view，所以只能手写组件内部上下滚动，主要是解决手指上下拖动其内容。

    但是因为监听touchmove导致不断更新Animation.translateY,在真机上测试出现非常严重的卡顿，到了无法忍受的地步，

代码略丑，如有想法可以提出

flootTouchStart: function(e){
    // console.log(e.touches[0].clientY)
    this.setData({
      floorTouchStart: e.touches[0]
    })
  },
  flootTouchMove: function(e) {
    // const flootTouchStartX = this.data.floorTouchStart.clinetX;
    const flootTouchStartY = this.data.floorTouchStart.clientY;
    // console.log(flootTouchStartY);
 
    // const flootMoveX = e.touches[0].clinetX;
    const floorMoveY = e.touches[0].clientY;
 
    let curMove = floorMoveY - flootTouchStartY;
    this.setData({
      floorTouchStart: e.touches[0]
    })
     
    if (this.data.floorList.length > 5 ) {
       
      if (this.data.floorMove > -(this.data.floorList.length - 5) * 32 && curMove < 0 ) { // 向下滚
         
        // console.log(curMove);
        this.setData({
          floorMove: curMove + this.data.floorMove
        })
      } else if (this.data.floorMove < 0 && curMove > 0) { // 向上滚
        this.setData({
          floorMove: curMove + this.data.floorMove
        })
      }
    }
    console.log('xx' + curMove)
    this.floorAnimation.translateY(this.data.floorMove).step()
    this.setData({
      floorAnimationData: this.floorAnimation.export()
    })
     
  },
// index.wxml
<cover-view class='chooseFloor' wx:if="{{chooseFloorShow}}" catchtouchstart='flootTouchStart' catchtouchmove='flootTouchMove'>
        <cover-view animation="{{floorAnimationData}}" class='inner-container'>
          <cover-view
          wx:for="{{floorList}}"
          wx:key="{{index}}"
          data-num="{{index}}"
          class='floorItem {{curFloor == item?"curfloor": ""}}'
          bindtap='confirmFloor'>
            <cover-view>{{item}}</cover-view>
          </cover-view>
        </cover-view>
      </cover-view>

1 回复

如果实在没人能解决，我只好使用canvas实现这个组件的上下滚动，以毒攻毒，不能操作dom真难受

回到顶部