vue+vant実装の取得検証コードカウントダウンボタン
1359 ワード
非常に簡単でよく使われる論理は、ログイン時に携帯電話の認証コードを取得し、カウントダウンするボタン論理です.私はモバイル側のuiプラグインvantを使っています.
詳細はvant公式サイトhttps://vant-contrib.gitee.io...を参照してください
ダイレクトコード
実はロジックは难しくありません私はここで3つのボタンロジックを使ってそれぞれ最初の携帯电话の入力ボックスの长さです6ビット未満ならば検証コードを取得するボタンはdisabledの长さが6ビット以上なら検証コードを取得してクリックしてカウントダウンcountdownボタンを表示することができます
dataで
methodsで
詳細はvant公式サイトhttps://vant-contrib.gitee.io...を参照してください
ダイレクトコード
実はロジックは难しくありません私はここで3つのボタンロジックを使ってそれぞれ最初の携帯电话の入力ボックスの长さです6ビット未満ならば検証コードを取得するボタンはdisabledの长さが6ビット以上なら検証コードを取得してクリックしてカウントダウンcountdownボタンを表示することができます
dataで
data(){
return{
phone: '',//
time: 60 * 1000,// 60 *10000
showCountdown: false//
}
}
methodsで
methods:{
getSmsCode(){
this.showCountdown = true//
},
countDownFinish(){//
this.showCountdown = false //
}
}