连续tap事件设置scroll-view的位置会导致tap事件触发延迟和卡死 - WXOPEN Club

当前 Bug 的表现

点击view触发tag事件，该事件只设置scroll-view属性scroll-into-view或scroll-top所需的值，连续点击两次以上会出现延迟，根据timeStamp显示至少会多出300，连续点击超过三次，前两次正常触发，中间点击的都无法触发，最后一次延迟触发

预期表现

每次点击都能按时触发tag事件

提供一个最简复现 Demo

Page({

data: {

ids: ["a", "b", "c", "d", "e", "f"],

id: 'a',

idTops: []

},

onLoad: function (options) {

var that = this

var query = wx.createSelectorQuery()

for (var i = 0; i < that.data.ids.length; i++) {

query.select('#' + that.data.ids[i]).boundingClientRect()

}

query.exec(function (res) {

var idTops = {}

for (var i = 0; i < res.length; i++) {

idTops[res[i].id] = res[i].top

}

that.setData({

idTops: idTops

})

},

switchClickEvent: function(e) {

console.log(e)

this.setData({

id: e.currentTarget.dataset.id

})

}

})

wxml

<view class='container'>

<view class='left'>

<view class='category {{id == item ? "category-selected" : ""}}' wx:for='{{ids}}' wx:key bindtap='switchClickEvent' data-id='{{item}}'>ID：{{item}}</view>

</view>

<scroll-view class='right' scroll-y scroll-into-view='{{id}}' scroll-top='{{idTops[id]}}'>

<view id='{{item}}' wx:for='{{ids}}' wx:key style='height: 500px; padding: 30rpx; background: #{{item + item + item}}'>ID:{{item}}</view>

</scroll-view>

<!-- <scroll-view class='right' scroll-y scroll-top='{{idTops[id]}}'>

<view id='{{item}}' wx:for='{{ids}}' wx:key style='height: 500px; padding: 30rpx; background: #{{item + item + item}}'>ID:{{item}}</view>

</scroll-view> -->

</view>

wxss

.container {

display: flex;

flex-direction: row;

position: absolute;

width: 100%;

height: 100%;

}

.left {

display: flex;

flex-direction: column;

height: 100%;

background: whitesmoke;

}

.right {

height: 100%;

flex: 1;

}

.category {

font-size: 30rpx;

line-height: 30rpx;

padding: 30rpx;

width: 100rpx;

color: #888;

}

.category-selected {

background: white;

color: #333;

font-weight: bold;

}