image.png
<el-col :span="16"><el-input placeholder="请输入手机号码" v-model="innerVisibleForm2.PhoneNum2"></el-input></el-col>
<el-col :span="16" v-show="verShow"><el-button @click="GetCode()" type="primary">获取验证码</el-button></el-col>
<el-col :span="16" v-show="!verShow"><el-button disabled type="info"><span>{{timer}}</span>秒后重新获取</el-button></el-col>
data () {
verShow: true, // 判断显示那个按钮
timer: 60, // 短信验证码倒计时
}
this.innerVisibleForm2.PhoneNum2是input内容
methods: {
GetCode () {
const regEmali = /^(0|86|17951)?(13[0-9]|15[0123456789]|17[678]|18[0-9]|14[57])[0-9]{8}$/
if (regEmali.test(this.innerVisibleForm2.PhoneNum2)) {
this.verShow = false
const authTimer = setInterval(() => {
this.timer--
if (this.timer <= 0) {
this.verShow = true
this.timer = 60
clearInterval(authTimer)
}
}, 1000)
} else {
this.$message.error('请输入合法手机')
}
},
}
