如何實(shí)現(xiàn)基于vue的短信驗(yàn)證碼倒計(jì)時(shí)
小編給大家分享一下如何實(shí)現(xiàn)基于vue的短信驗(yàn)證碼倒計(jì)時(shí)，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
專注于為中小企業(yè)提供成都網(wǎng)站制作、做網(wǎng)站、外貿(mào)營銷網(wǎng)站建設(shè)服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)梓潼免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都，凝聚了一批互聯(lián)網(wǎng)行業(yè)人才，有力地推動(dòng)了1000+企業(yè)的穩(wěn)健成長，幫助中小企業(yè)通過網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。
一般獲取短信驗(yàn)證碼的時(shí)候會(huì)用到這個(gè)demo：
button里面包兩個(gè)span標(biāo)簽，根據(jù)點(diǎn)擊狀態(tài)，顯示不同的span，關(guān)鍵代碼就是倒計(jì)時(shí)：
{{time+'秒后獲取'}}
send
button {
width: 100px;
height: 50px background: pink;
}var vm = new Vue({
el: '#example',
data() {
return {
time: 60, // 發(fā)送驗(yàn)證碼倒計(jì)時(shí)
sendMsgDisabled: false
}
},
methods: {
send() {
let me = this;
me.sendMsgDisabled = true;
let interval = window.setInterval(function() {
if ((me.time--) <= 0) {
me.time = 60;
me.sendMsgDisabled = false;
window.clearInterval(interval);
}
}, 1000);
}
}
})以上是“如何實(shí)現(xiàn)基于vue的短信驗(yàn)證碼倒計(jì)時(shí)”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
分享名稱：如何實(shí)現(xiàn)基于vue的短信驗(yàn)證碼倒計(jì)時(shí)
網(wǎng)站地址：
http://weahome.cn/article/jcsjjs.html
重慶分公司
重慶分公司
