image.png
功能點(diǎn)：
1、點(diǎn)擊“獲取驗(yàn)證碼”對(duì)上面3個(gè)input進(jìn)行驗(yàn)證
2耕赘、點(diǎn)擊確定對(duì)整個(gè)表單進(jìn)行驗(yàn)證
// 獲取驗(yàn)證碼
getCode() {
this.disableGetCode = true;
const p1 = new Promise(resolve => {
this.$refs["form"].validateField("orgid", err => {
resolve(err);
});
resolve();
});
const p2 = new Promise(resolve => {
this.$refs["form"].validateField("name", err => {
resolve(err);
});
resolve();
});
const p3 = new Promise(resolve => {
this.$refs["form"].validateField("tel", err => {
resolve(err);
});
resolve();
});
// 全部驗(yàn)證通過(guò)才發(fā)送請(qǐng)求
Promise.all([p1, p2, p3])
.then(result => {
if (!result.join("")) {
this.codeMessage = 60;
let s = setInterval(() => {
this.codeMessage--;
}, 1000);
let s1 = setTimeout(() => {
clearInterval(s);
this.disableGetCode = false;
this.codeMessage = "獲取驗(yàn)證碼";
}, 1000 * 60);
// 發(fā)送驗(yàn)證碼請(qǐng)求
} else {
this.disableGetCode = false;
}
})
.catch(() => {
this.disableGetCode = false;
});
}
// 確定
confirm() {
this.$refs["form"].validate(valid => {
if (valid) {
// 驗(yàn)證通過(guò)
}
});
},
