element 如何点击提交时 同时验证父子组件的表单

  • Z时代
  • 2024-03-07
  • 分类：IT

element 如何点击提交时 同时验证父子组件的表单
如图 如何点击提交按钮的时候 同时验证父子组件的这两个输入框

submit(form) {
  console.log(this.form)
  this.$refs[form].validate(valid => {
    if (valid) {
      alert('submit!')
    } else {
      console.log('error submit!!')
      return false
    }
  })
}
在父组件用了上边的代码 但无法验证子组件，尽管子组件的rules有红色提示，也还是能提交成功

回答：

promise.all([
this.$refs[父组件formRef].validte(),
this.$refs[子组件ref].validate()
]).then(() => {
console.log("都验证成功")
})

// 子组件
methods: {
validate() {
return this.$refs[子组件formRef].validate()
}
}

回答：

把父组件的submit方法嵌套到子组件的validate方法里，这样只有2个校验都通过才会提交

以上是 element 如何点击提交时 同时验证父子组件的表单 的全部内容， 来源链接： utcz.com/p/935732.html

回到顶部