vue+element 获取验证码 |
您所在的位置：网站首页 › vue登录页面带验证码 › vue+element 获取验证码 |
vue+element 获取验证码
|
我们在做一个项目，登录注册页面是少不了的，为了人机校验，验证码也是必须的 我的这个项目获取验证码，前端发送一个随机四位数给后端，后端返回一张图片，前端渲染就可以
template代码： 1 2 13 14 15 16 17 登录data数据声明： 1 data() { 2 return { 3 loginForm: { 4 username: "", 5 password: "", 6 captcha_key: "", 7 captcha_code: "" 8 }, 9 } 10 }mounted数据加载完执行方法： 1 mounted() { 2 // 得到验证码图片 3 this.changeCode(); 4 }, methods方法： 1 getCaptchaKey() { 2 let captchaKey = Math.random() 3 .toString(36) 4 .substring(2); 5 return captchaKey; 6 }, 7 changeCode() { 8 let captcha_key = this.getCaptchaKey(); 9 this.loginForm.captcha_key = captcha_key; 10 this.$refs.code.setAttribute( 11 "src", 12 process.env.VUE_APP_API_URL + 13 "auth/get_captcha?captcha_key=" + 14 captcha_key 15 ); 16 }
|
【本文地址】