用vue写轮播，怎么判断在动画过程中

Question

next是点击下一张图触发的函数，可是连续点击会造成动画过快，所以怎么判断在过渡动画过程中呢，图中的代码

                next(){
                    if(this.index==this.originalData.num){
                        this.index=1
                    }else{
                        
                        this.index+=1
                    }
                    this.animate(this.originalData.img_width)
    
                },
                animate(offset){

                    var node=this.$refs.wrapperContent
                    var self=this;
                    var left=parseInt(node.style.left)-offset
                    this.isTrans=true
                    node.style.left=left+'px'
                    console.log(left)
                    setTimeout(function(){
                        if(left<-(self.originalData.num*self.originalData.img_width)){
                            self.isTrans=false
                            node.style.left=-self.originalData.img_width+'px'
                        }
                        if(left>-100){
                            self.isTrans=false
                            node.style.left=-self.originalData.num*self.originalData.img_width+'px'
                        }
                    },this.originalData.delay)
                }

Answer 1

按题主给的代码段，animate函数里this.isTrans=true已经做了节流阀设置，
那么在next函数可以判断节流阀状态来确认是否执行animate函数，代码修改如下:

next(){
    if(!this.isTrans){
        if(this.index==this.originalData.num){
            this.index=1
        }else{
            this.index+=1
        }
        this.animate(this.originalData.img_width);
    }
}