前端--登录之图片验证码

<input  type="text" name="captcha" v-model="data.captcha" placeholder="请输入验证码" class="code-input" />
// uniapp中 点击事件的语法是tap
<image :src="captchaUrl" @tap="refreshCaptcha" class="code-image"/> 

const refreshCaptcha = async () => {
    //验证码 一般是后端处理 输入的验证码和图片中的验证码是否一致
    //底下的链接是在线生成图片二维码的链接
    captchaUrl.value = `https://dummyimage.com/100x40/fff/000&text=`+ Math.random().toString(36).substr(2, 4)
    }
// 在一进入页面调用 refreshCaptcha() 获取验证码的方法
onShow(() => {
        refreshCaptcha()
    })