註冊帳號倒計時

1.htmljavascript

<div class="code-button">
                        <el-button type="text" :disabled="isDisabled"  @click="handleMobileNum()">{{buttonText}}</el-button>
                    </div>

2javascripthtml

isDisabled: false,
                buttonText: '點擊獲取驗證碼',
                time: '59',





handleMobileNum() {
                if (this.isDisabled == true) {
                    return;
                }
                if (this.form.mobile == '') {
                    this.$message.error('請填寫手機號');
                    return;
                }
                // if (!(/^1[3456789]\d{9}$/.text(this.form.mobile))) {
                //     this.$message.error('手機號碼格式錯誤');
                //     return;
                // }
                var data = {
                    mobile: this.form.mobile,
                    captcha_id: this.captcha_image_id,
                    captcha_code: this.form.captcha_code
                }
                this.$http.post('/sms/send/register', data).then(res => {
                    if (!res.success == true) {
                        this.$message.success('驗證碼發送成功!');
                        let that = this;
                        that.isDisabled = true;
                        let interval = window.setInterval(() => {
                            that.buttonText = that.time + '秒後可從新發送';
                            --that.time;
                            if (that.time <= 0) {
                                that.buttonText = '從新發送';
                                that.isDisabled = false;
                                window.clearInterval(interval);
                                that.time = '59'
                            }
                        }, 1000)
                    } else {
                        this.$message.error('發送失敗,請重試');
                    }
                })
            },
相關文章
相關標籤/搜索