From ffc440f78182ba4949291b081e4949e9a0ca65a9 Mon Sep 17 00:00:00 2001 From: Tevin <tingquanren@163.com> Date: Tue, 11 May 2021 15:42:52 +0800 Subject: [PATCH] 优化跨端通讯容错 --- forms/form/CForm.vue | 67 ++++++++++++++++++++++++++++----- 1 files changed, 56 insertions(+), 11 deletions(-) diff --git a/forms/form/CForm.vue b/forms/form/CForm.vue index a13df65..8e42097 100644 --- a/forms/form/CForm.vue +++ b/forms/form/CForm.vue @@ -1,5 +1,5 @@ /** - * CForm + * CForm - 表单套装组件,套件的主体 * @author Tevin */ @@ -8,7 +8,7 @@ class="c-form" @submit="evt=>handleSubmit()" > - <slot :formData="formData" /> + <slot :formRes="formRes" /> </form> </template> @@ -19,23 +19,37 @@ export default { name: 'CForm', props: { + // 表单数据主体 formData: Object, + // 表单项变化的回调 + // 回调传参只有单项数据 onChange: Function, + // 表单完成的回调 + // 提交且通过表单验证后调用,不通过验证不调用 + // 回调传参包含整个表单数据 onFinish: Function, }, data() { return { + formRes: { + formData: this.formData, + }, validators: {}, }; }, methods: { handleSubmit() { const checklist = []; - Object.keys(this.validators).forEach((key) => { - checklist.push(this.validators[key]()); + // 所有项验证 + Object.keys(this.validators).forEach(key => { + // 仍有效的验证器 + if (this.validators[key]) { + checklist.push(this.validators[key]()); + } }); - Promise.all(checklist).then((validations) => { + Promise.all(checklist).then(validations => { for (let validation of validations) { + // 第一个不通过项提示 if (!validation.passed) { Taro.showToast({ title: validation.msg, @@ -50,19 +64,50 @@ this.onFinish && this.onFinish(); }); }, + preCheckValidators(keys, callback) { + const checklist = []; + // 从选定的项中验证 + keys.forEach(key => { + // 效的验证器 + if (this.validators[key]) { + checklist.push(this.validators[key]('msgOnly')); + } + }); + Promise.all(checklist).then(validations => { + for (let validation of validations) { + // 第一个不通过项提示 + if (!validation.passed) { + Taro.showToast({ + title: validation.msg, + icon: 'none', + mask: false, + duration: 2000, + }); + // 检查失败 + callback && callback(false); + return; + } + } + // 所有检查通过 + callback && callback(true); + }); + }, }, mounted() { - this.formData.$handleChange = (evt = []) => { - Object.keys(evt).forEach((key) => { - if (typeof this.formData[key] === 'undefined') { - this.$set(this.formData, key, evt[key]); + // 当表单项变化时 + this.formRes.$handleChange = (evt = []) => { + Object.keys(evt).forEach(key => { + // 直接改值 + if (typeof this.formRes.formData[key] === 'undefined') { + this.$set(this.formRes.formData, key, evt[key]); } else { - this.formData[key] = evt[key]; + this.formRes.formData[key] = evt[key]; } }); this.onChange && this.onChange(evt); }; - this.formData.$regItemValidator = (name, cb) => { + // 注册表单验证器 + this.formRes.$regItemValidator = (name, cb) => { this.validators[name] = cb; }; }, -- Gitblit v1.9.1