vue+element-plus 父组件校验多子组件的form表单

对于父组件校验多个子组件的表单，可以考虑使用 `$refs` 和 `$children` 属性来获取子组件的表单对象，然后在父组件中进行校验。

首先，在子组件中定义一个 `ref`，例如：

<template>
  <el-form ref="form">
    ...
  </el-form>
</template>

然后，在父组件中使用 `$refs` 属性获取所有子组件的表单对象，例如：

<template>
  <el-form ref="parentForm">
    <child-form ref="childForm1"></child-form>
    <child-form ref="childForm2"></child-form>
    ...
  </el-form>
</template>
<script>
  export default {
    methods: {
      validateChildForms() {
        const childForms = this.$refs.parentForm.$children.filter(child => child.$refs.form);
        let isValid = true;
        for (const childForm of childForms) {
          if (!childForm.$refs.form.validate()) {
            isValid = false;
          }
        }
        return isValid;
      }
    }
  }
</script>

上述代码中，`validateChildForms` 方法获取所有子组件的表单对象，然后遍历进行校验，最后返回整个表单的校验结果。

注意，上述代码中使用了 `$children` 属性获取子组件，但是这种方式会获取到所有子组件，包括不是表单的组件，所以需要使用 `filter` 方法进行过滤。另外，由于 `$refs` 和 `$children` 属性都是非响应式的，所以如果子组件动态添加或删除，需要手动更新校验逻辑。