vant +vue +promise自定义表单校验
表单内容```<van-cell-group><p class="tip">反馈内容(必填)</p><van-field v-model="message" type="textarea" placeholder="请输入您要反馈的内容" rows="6" autosize /><p class="tip"&...
·
表单内容```
<van-cell-group>
<p class="tip">反馈内容(必填)</p>
<van-field v-model="message" type="textarea" placeholder="请输入您要反馈的内容" rows="6" autosize />
<p class="tip">联系方式(必填)</p>
<van-field
v-model="phone"
placeholder="请选择填写手机号、微信号、QQ号"
:error-message="errMessage"
@blur="test"
/>
</van-cell-group>
<button @click="submit" :class="classObj">提交</button>
test()校验表单内容,然后返回不同的resolve()值, 在sumit()提交时根据返回值判断是否可以提交
test() {
let p = new Promise((resolve, reject) => {
const reg = /^1[3|4|5|7|8][0-9]\d{8}$/;
if (this.message == "") {
this.$dialog.alert({
title: "提示",
message: "内容不能为空"
});
resolve(false);
} else if (!reg.test(this.phone)) {
this.$dialog.alert({
title: "提示",
message: "手机号格式不正确"
});
resolve(false);
} else {
resolve(true);
}
});
return p;
},
submit() {
this.test().then(function(data) {
console.log(data);
});
}
更多推荐
已为社区贡献1条内容
所有评论(0)