@carpenter/vue-tencent-captcha

安装

npm i @carpenter/vue-tencent-captcha

引用

  import vueTencentCaptcha from '@carpenter/vue-tencent-captcha';
  
  Vue.use(vueTencentCaptcha);

属性

成员	说明	类型	默认值
appid	appid	String	无
callback	验证成功的回调函数	function	无
options	配置参数	object	无

示例

1. 配置node 环境变量 TENCENT_CAPTCHA_APPID 则组件使用时可以省略。

vue:

编辑env文件 添加：
process.env.TENCENT_CAPTCHA_APPID: 'xxxx'

nuxt:

export default {
  env: {
    TENCENT_CAPTCHA_APPID: 'xxxx'
  }
};

2. 配置组件 appid 默认覆盖 TENCENT_CAPTCHA_APPID

<vueTencentCaptcha :options="options" @callback="captchaCallback">
  点我啊
</vueTencentCaptcha>

<vueTencentCaptcha appid="2028109764" @callback="captchaCallback" />

<vueTencentCaptcha appid="2028109764" :options="options" @callback="captchaCallback">
  点我啊
</vueTencentCaptcha>

<vueTencentCaptcha appid="2028109764" @callback="captchaCallback" />

options : {
  bizState: '123',
},

// 隐藏验证码
this.$root.captcha.destroy(); 
// 显示验证码
this.$root.captcha.show();

// 回调
captchaCallback(res) {
  console.log(res);
}