收藏
回答

监听touchmove时,第一次监听会出现固定距离的延迟吗?

我想实现一个列表的下拉刷新,但是scroll-view没法做过渡动画,因此使用监听touch事件的方式手动实现。但是每次touchstart后的第一次监听到touchmove事件时,都是移动了至少30个坐标,请问是我使用有问题还是本来微信的设计就是如此?

// wxml
<scroll-view scroll-y="true" scroll-top="{{scrollTop}}" 

    bindtouchstart="touchstart"

    bindtouchend="touchend"

    catchtouchmove="touchmove"

    bindscroll="scroll"

    bindscrolltoupper="refresh"

    bindscrolltolower="getmore"

  >

    <view class="loading" style="height:{{refreshHeight}}px;transition-duration:{{loadingTime}}s">

      load

    </view>

    <view style="height:100%">

      <view class="item" wx:for="{{list}}" wx:key="text">  

          <text class="description">{{item.text}}</text>  

      </view>

    </view>  

  </scroll-view>
// js
  touchstart:function(event){
   console.log("touch-start");
    console.log(event.touches[0].pageY);
    if(this.data.scrollTop==0){
      this.setData({startY:event.touches[0].pageY,touchNum:this.data.touchNum+1})
    }
  },

  touchend:function(event){
    console.log("touch-end");
    if(event.touches.length==0)
      this.setData({refreshHeight:20,loadingTime:0.2})
  },

  touchmove:function(event){
    if(this.data.scrollTop==0){
      var changeY=(event.touches[0].pageY-this.data.startY)*1.5;
      console.log("changeY-before",changeY);
      var newH=this.data.refreshHeight+changeY;
      newH=(newH>=20?newH:20);
      newH=(newH<=150?newH:150);


      changeY=changeY>0?changeY:-changeY;
      this.setData({loadingTime:changeY*0.01});
      this.setData({refreshHeight:newH,startY:event.touches[0].pageY});
    }
  }


回答关注问题邀请回答
收藏

3 个回答

登录 后发表内容
问题标签