vue中按鈕間隔一段時間60秒后才可以點擊

<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>

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容