发送手机验证码的样例

在实际工作中,项目都需要注册和登录.

html页面:

//绑定name和password

 <i-text label="name" v-model="name"></i-text>

<i-passsword label="password" v-model="password"></i-passwprd>

//发送动态码按钮,去获得动态码

<button type="button" v-if="alreadySend" :class="{'color-red': !waitTime}" @click="sendmessage">重新发送<span v-if="waitTime">({{waitTime}})</span></button> (还有60秒的时间限制)

<button v-else class="color-red" @click="sendmessage">获取动态码</button>

JS中:

data中去定义

data ( )

{

   alreadySend: false,

   waitTime: 0

}

//去发送验证码

sendmessage () {

//看是否已在发送中

if (this.waitTime) return
   
this.alreadySend = true
this.setTime(60)

 $.fetch({

url:'',

data:''

})

// setTime 时间设置

setTime (time) {

   this.waitTime = time
    let si = setInterval(() => {
    this.waitTime--
   if (this.waitTime <= 0) {
   clearInterval(si)
   }
}, 1000)
}