vue 项目登录页面添加验证码

identify
这是一个vue的插件,使用canvas来生成图形验证码。

具体参数如下:


直接上测试代码:
identify.vue组件(主要用于定义参数和方法)



在 main.js进行引入(注意路径的地址):

import SIdentify from './components/page/identify'
Vue.use(SIdentify)



codetest.vue(在页面进行使用):






注意图片验证码的宽高是由参数 contentWidth 和 contentHeight 决定的,所以更改宽高的时候,直接在声明的参数中进行更改就可。

测试效果:

这里写图片描述

 

你可能感兴趣的:(vue)