html
<div class="row" v-for="(time, index) in timeList">
<div class="but" @click="start(time, index)">開始</div>
<div>{{time.count}}</div>
</div>
js
data () {
return {
timeList: [{id: '0', count: 60, whetherStart: false}, {id: '1', count: 60, whetherStart: false}, {id: '2', count: 60, whetherStart: false}]
};
},
methods: {
start (time, index) {
if (!time.whetherStart) {
time.whetherStart = true;
this.reduceCount(index);
}
},
reduceCount (index) {
let _index = index;
let time = setInterval(() => {
if (this.timeList[_index].count > 0) {
this.timeList[_index].count--;
} else {
this.timeList[_index].count = 60;
this.timeList[_index].whetherStart = false;
}
if (this.timeList.filter(item => item.count !== 60).length === 0) clearInterval(time);
}, 1000);
}
}