<template>
<div>
<a href="/home"></a>
<button class="button" :disabled="buerzhi"
? ? ? ? ? ? style="margin-left: 70px;margin-top: 15px" @click="dianji()">{{content}}
</button>
<button @click="countDown">點擊后倒計時</button>
</div>
</template>
<script>
export default {
name:'HelloWorld',
data() {
return {
buerzhi:true,
content:'等待醫(yī)生進入房間',
totalTime:10,
canClick:true,//添加canClick
? ? ? }
},
methods: {
dianji(){//10秒后可以點擊執(zhí)行的方法
? ? ? ? console.log("10秒后點擊可以執(zhí)行的方法")
this.buerzhi =true
? ? ? ? this.countDown()
},
countDown() {
//改動的是這兩行代碼
this.buerzhi =true
? ? ? ? this.content =this.totalTime +'s后判定離線'
? ? ? ? let clock =window.setInterval(() => {
this.totalTime--
this.content =this.totalTime +'s后判定離線'
? ? ? ? ? if (this.totalTime <0) {
console.log("可以點擊")
window.clearInterval(clock)
this.buerzhi =false
? ? ? ? ? ? this.content ='判定醫(yī)生離線'
? ? ? ? ? ? this.totalTime =10
? ? ? ? ? // this.canClick = true? //這里重新開啟
? ? ? ? ? }
},1000)
},
}
}
</script>
<style scoped>
</style>