子组件代码

// 子组件
validateForm() {
return new Promise((resolve, reject) => {
this.$refs.contractBaseRef.validate((valid) => {
if (valid) {
resolve(this.getFormData())
} else {
this.$message.error('请完成必填项输入!')
resolve(false)
}
})
})

子组件代码

// 父组件
<template>
<contract-base-edit ref="outBaseInfoRef" />
</template>
<script>
// methods
this.$refs['outBaseInfoRef'].validateForm().then(res => {
console.info('res out', res)
})
</script>

Vue 父子组件表单同步校验的更多相关文章

  1. vue中的表单异步校验方法封装

    在vue项目的开发中,表单的验证必不可少,在开发的过程中,用的是vue+iview的一套,我们知道iview的表单验证是基于async-validator,对于async-validator不熟悉的可 ...

  2. vue中form 表单常用校验封装(async-validator)

    新建一个js校验文件validate.js export const regular = { // 验证自然数 naturalNumber: /^(([0-9]*[1-9][0-9]*)|(0+))$ ...

  3. vue:父子组件间通信,父组件调用子组件方法进行校验子组件的表单

    参考: ElementUI多个子组件表单的校验管理:https://www.jianshu.com/p/541d8b18cf95 Vue 子组件调用父组件方法总结:https://juejin.im/ ...

  4. vue父子组件状态同步的最佳方式续章(v-model篇)

    大家好!我是木瓜太香!一名前端工程师,之前写过一篇<vue父子组件状态同步的最佳方式>,这篇文章描述了大多数情况下的父子组件同步的最佳方式,也是被开源中国官方推荐了,在这里表示感谢! 这次 ...

  5. vue validate多表单验证思考 之前写过一个里外层,现在觉得不合适,应该平行的写,然后都给ret,最后判断ret 再做出反应,这样整体表单的所有验证就都报验证,然后最后提交的时候把组件内的对象合并到总的对象,再提交

    vue validate多表单验证思考 之前写过一个里外层,现在觉得不合适,应该平行的写,然后都给ret,最后判断ret 再做出反应,这样整体表单的所有验证就都报验证,然后最后提交的时候把组件内的对象 ...

  6. vue父子组件通信高级用法

    vue项目的一大亮点就是组件化.使用组件可以极大地提高项目中代码的复用率,减少代码量.但是使用组件最大的难点就是父子组件之间的通信. 子通信父 父组件 <template> <div ...

  7. 【VUE】3.表单操作

    1. Form组件渲染 1. components -> 新增组件Form.vue <template> <div>表单验证</div> </templ ...

  8. elementui 多组件表单验证

      最近在做管理后台,vue2.0基于elementui框架进行开发. elementui的api中表单验证都是单个vue文件的验证.而我的保存按钮放在了父组件了,验证对象为三个子组件我的灵机一动 想 ...

  9. 【Vue】强化表单的9个Vue输入库

    一个设计不当的表单可能会使用户远离你的网站.幸运的是,对Vue开发者,有大量可用的Vue输入库让你轻松整理表单. 拥有直观而且对用户友好的表单有诸多好处,比如: 更高的转化率 更好的用户体验 更专业的 ...

随机推荐

  1. linux日志朔源分析记录

    lastlog 记录用户最后一次登录情况 只有root最近登录过 lastlog -u 用户名或者uid uid 直接在passwd文件中的低三位可以看到 lastb 记录用户用户登录失败的用户记录, ...

  2. 最大连续区间(HDU-1540)

    HDU1540 线段树最大连续区间. 给定长度为n的数组,m次操作. 操作D,删除给定节点. 操作R,恢复最后一个删除的节点. 操作Q,询问给定节点的最大连续区间 维护三个值,区间的最大左连续区间,最 ...

  3. python函数里引用全局变量

    python在引用变量的时候尤其要注意变量的作用域,在函数里引用不可变类型变量的时候,函数执行结束后是不会改变全局变量的值的:若想在函数里改变不可变类型全局变量的值时,引用的时候要用”global a ...

  4. Python定位模块_PYTHONPATH变量

    Python定位模块: 导入模块时,系统会根据搜索路径进行寻找模块: 1.在程序当前目录下寻找该模块 2.在环境变量 PYTHONPATH 中指定的路径列表寻找 3.在 Python 安装路径中寻找 ...

  5. PHP array_map() 函数

    实例 将函数作用到数组中的每个值上,每个值都乘以本身,并返回带有新的值的数组: <?phpfunction myfunction($v){return($v*$v);} $a=array(1,2 ...

  6. Python List remove()方法

    描述 remove() 函数用于移除列表中某个值的第一个匹配项.高佣联盟 www.cgewang.com 语法 remove()方法语法: list.remove(obj) 参数 obj -- 列表中 ...

  7. PHP acosh() 函数

    实例 返回不同数的反双曲余弦: <?phpecho(acosh(7) . "<br>");echo(acosh(56) . "<br>&qu ...

  8. PHP zip_entry_open() 函数

    定义和用法 zip_entry_open() 函数打开一个 zip 档案以供读取.高佣联盟 www.cgewang.com 如果成功,该函数则返回 TRUE.如果失败,则返回 FALSE. 语法 zi ...

  9. linux的存储管理(RALD) LVM 逻辑卷管理 虚拟阵列

    磁盘存储管理 LVM 逻辑卷 虚拟阵列 1.Linux系统中 磁盘使用 存在3个大问题: 1.灵活性 2.安全性 3.性能 2.解决办法RAID独立磁盘冗余阵列 RAID(Redundant Arra ...

  10. mapstruct解放Java对象转换

    摘要 当前web后端开发,都是使用多层工程结构,需要在VO,BO,DTO,DO等各种数据结构中相互转换.这些转换代码都是些比较简单的字段映射,类型转换,重复性工作比较高,可以使用一些工具解放我们的双手 ...