亚洲激情专区-91九色丨porny丨老师-久久久久久久女国产乱让韩-国产精品午夜小视频观看

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

vue怎么實現驗證碼60秒倒計時功能

發布時間:2022-11-04 09:23:20 來源:億速云 閱讀:113 作者:iii 欄目:開發技術

本文小編為大家詳細介紹“vue怎么實現驗證碼60秒倒計時功能”,內容詳細,步驟清晰,細節處理妥當,希望這篇“vue怎么實現驗證碼60秒倒計時功能”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來學習新知識吧。

html代碼如下:

<span v-show="show" @click="getCode">獲取驗證碼</span>
<span v-show="!show" class="count">{{count}} s</span>

js代碼如下:

 data(){
 return {
 show: true,
 count: '',
 timer: null,
 }
 },
 methods:{
 getCode(){
  const TIME_COUNT = 60;
  if (!this.timer) {
  this.count = TIME_COUNT;
  this.show = false;
  this.timer = setInterval(() => {
  if (this.count > 0 && this.count <= TIME_COUNT) {
   this.count--;
   } else {
   this.show = true;
   clearInterval(this.timer);
   this.timer = null;
   }
  }, 1000)
  }
 } 
 }

Vue的優點

Vue具體輕量級框架、簡單易學、雙向數據綁定、組件化、數據和結構的分離、虛擬DOM、運行速度快等優勢,Vue中頁面使用的是局部刷新,不用每次跳轉頁面都要請求所有數據和dom,可以大大提升訪問速度和用戶體驗。

讀到這里,這篇“vue怎么實現驗證碼60秒倒計時功能”文章已經介紹完畢,想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領會,如果想了解更多相關內容的文章,歡迎關注億速云行業資訊頻道。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

vue
AI

登封市| 桂阳县| 包头市| 霞浦县| 孝昌县| 乌审旗| 绥德县| 万载县| 潼关县| 金坛市| 遵义市| 吉林市| 南木林县| 龙井市| 电白县| 武川县| 诸暨市| 北海市| 华宁县| 洛川县| 西乡县| 宣汉县| 桐梓县| 武穴市| 广德县| 博客| 托克托县| 响水县| 大宁县| 台北县| 年辖:市辖区| 宜川县| 龙海市| 武清区| 竹北市| 自贡市| 云霄县| 凭祥市| 辛集市| 如东县| 夏津县|