通过图片字符串显示验证码

通过接口显示验证码的方法。

state.codeSrc = 'data:image/png;base64,' + res.image;

<img :src="state.codeSrc" @click="changeCode()" alt="验证码" />

如果只通过字符串显示验证码,放到<img src=" ">即可通过浏览器显示出来

<img src="data:image/png;base64,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" alt="验证码" />