运用实际场景:需要发一个验证码,然后等60秒才能进行第二次点击
<div class="vcode-btn" @click.prevent="getVcode"> <i v-show="vcode">获取验证码</i> <
i v-show="!vcode">{{count}}s</i> </div> <script> data() { return { vcode: true,
count:'', timer: null } methods: { //获取验证码 getVcode() { const reg = /^1[3|4|5|6|
7|8|9][0-9]\d{8}$/; # 获取验证码前,先验证手机号的有效性 if (reg.test(this.UserInfo.phone) &&
this.UserInfo.phone.length!== 0) { this.vcode = false let TIME_COUNT = 60; if (!
this.timer) { this.count = TIME_COUNT this.timer = setInterval(() => { if (
this.count> 0 && this.count <= 60) { this.count -- } else { this.vcode = true
clearInterval(this.timer) this.timer = null } }, 1000) } const url =
api.verifycode_url.urllet phone = { mobile: this.UserInfo.phone } axios.post(
url, phone).then(resp => { if (resp.data.status === "success") { this.$message({
type:'success', message: "验证码发送成功,请注意查收!" }) } else { this.$message({ type:
'error', message: resp.data.msg }) } }) } else { this.$message({ type: 'error',
message:'请输入正确手机号' }) } }, } </script>

技术
©2019-2020 Toolsou All rights reserved,
css中上下左右居中的几种实现方法[CISCN 2019 初赛]Love Mathc/c++语言实现登陆界面Unity3D 人称设置(第一人称视角、第三人称视角)Fastadmin框架自定义搜索操作流程2021最新Python自动化软件测试笔试题(含答案)黑客帝国装逼的代码雨mysql数据库设置字符集配置修改my.ini文件(windows)python之panda模块1Python学习笔记:基础+进阶10道练习题