有关自定义组件的事件触发延迟问题
发布于 6 年前 作者 xiongyang 6646 次浏览 来自 问答

从自定义组件内部使用

this.triggerEvent(‘num-change’,1)将数据传到组件外，在外部使用e.detail获取这个值，如果点击过快的话会导致数据出错，例如多个组件加起来的值为0，但组件外计算的值却为-1或其他不对的值。


代码如下：

自定义组件：

<view class="num-controller">
  <view class="iconfont icon-jianshao sub-btn" hidden="{{init}}" bindtap="sub"></view>
  <view class="goods-num" hidden="{{init}}">{{num}}</view>
  <view class="iconfont icon-zengjia add-btn" bindtap="add"></view>
</view>
methods: {
   add() {
      
     if (this.data.init) {
       this.setData({
         init: false
       })
     }
     this.setData({
       num: this.data.num + 1
     })
     this.triggerEvent('numChange', 1);
   },
   sub() {
     if(this.data.num > 0) {
       this.setData({
         num: this.data.num - 1
       })
     }
     if(this.data.num == 0){
       this.setData({
         init: true
       })
     }
     this.triggerEvent('numChange', -1);
   }
 }

外部：

<num-controller num="{{0}}" bindnumChange="numChange"></num-controller>

numChange(e) {

    const num = e.detail;
    this.setData({
      goodsNum: this.data.goodsNum + num
    })
  },

因为每次触发

this.trigerrEvent都有一个时间戳，这个时间戳导致了组件内外的数据有差异，点击过快的时候就会出现bug，不知道该如何解决？哪位大佬指导一下？

1 回复

定义个data，用户点下的时候设置已点击，获取到数据时再初始化下数据，如果data是已点击状态无论点多少次都返回 return false

回到顶部