| | |
| | | /** |
| | | * CInputPhoneCode |
| | | * CInputPhoneCode - 表单项,手机验证码输入框 |
| | | * @author Tevin |
| | | */ |
| | | |
| | |
| | | AtButton, |
| | | }, |
| | | props: { |
| | | placeholder: String, |
| | | // 表单数据资源(表单组件内部机制专用) |
| | | itemRes: Object, |
| | | autoStart: { type: Boolean, default: true }, |
| | | // 占位提示 |
| | | placeholder: String, |
| | | // 验证码计时器开始方式 |
| | | // true 点击按钮后立即自动开始 |
| | | // false 后台返回为成功时才开始 |
| | | autoStart: { |
| | | type: Boolean, |
| | | default: true, |
| | | }, |
| | | // 发送请求,通知后端给手机发验证码 |
| | | onCallPhoneCode: Function, |
| | | // 刷新cd后,通知父组件更新图片地址 |
| | | onRefreshCD: { |
| | | type: Function, |
| | | default: () => () => null, |
| | | }, |
| | | }, |
| | | data() { |
| | | return { |
| | | cd: 60, |
| | | holding: false, |
| | | timer: null, |
| | | }; |
| | | }, |
| | | computed: { |
| | |
| | | const startCD = () => { |
| | | this.holding = true; |
| | | this.cd = 60; |
| | | setInterval(() => { |
| | | clearInterval(this.timer); |
| | | this.timer = setInterval(() => { |
| | | this.cd -= 1; |
| | | if (this.cd === 0) { |
| | | this.holding = false; |
| | | this.cd = 60; |
| | | this.onRefreshCD(true); |
| | | } |
| | | }, 1000); |
| | | }; |
| | |
| | | }); |
| | | } |
| | | }, |
| | | // 重置holding |
| | | $resetHolding() { |
| | | this.holding = false; |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |