手写场景题
1.验证码60s冷却
<script setup>
import { ref,computed } from 'vue'
const msg = ref('Hello World!')
const isBand= ref(true) //按钮禁用
const timer =ref(0)
const msgInfo= computed(()=>{
if(timer.value===0){
return "发送验证码"
}else{
return `请${timer.value}秒后重试`;
}
})
const sendCode = ()=>{
if(isBand.value){
timer.value=60;
isEnugh.value=false;
const time=setInterval(()=>{
timer.value-=1;
if(timer.value===0){
clearInterval(time)
isBand.value=true
}
},1000)
}
}
</script>
<template>
<input v-model="msg" />
<button @click="sendCode" :disabled="!isEnugh">{{msgInfo}}</button>
</template>
License:
CC BY 4.0