VerificationCode 验证码倒计时

按钮触发获取验证码，展示倒计时。

代码演示

基础用法

点击获取验证码触发onClick事件并开始倒计时或设置autoCountDown为true自动开始倒计时。

<hd-verification-code :autoCountDown="autoCountDown" @onClick="onClick"></hd-verification-code>

export default {
  data() {
    return {
      autoCountDown: true
    }
  },
  methods: {
    onClick() {
      console.log('点击获取验证码')
    }
  }
}

倒计时时间

通过second设置倒计时时间，默认60s。

<hd-verification-code :second="second"></hd-verification-code>

export default {
  data() {
    return {
      second: 60
    }
  }
}

主题颜色

通过type设置主题，支持主题类型有primary、error、warning、success，默认primary。

<hd-verification-code type="primary"></hd-verification-code>
<hd-verification-code type="error"></hd-verification-code>
<hd-verification-code type="warning"></hd-verification-code>
<hd-verification-code type="success"></hd-verification-code>

Props

Name	Description	Type	Required	Default
second	验证码倒计时秒数（单位s）	Number	false	默认值：60
type	主题类型	'primary' / 'error' / 'warning' / 'success'	false	默认值：primary
autoCountDown	是否自动开启倒计时	Boolean	false	默认值：false

Events

Event Name	Description	Parameters
onClick	验证码按钮点击事件	-
timeup	倒计时结束时触发	-