ElementUI的多个form表单的校验

在ElementUI中，可以使用this.$refs来访问到每个form表单的实例，并调用其validate方法来进行验证。以下是一个简单的例子：

假设你有两个form表单元素，分别是form1和form2。

<el-form ref="form1" :model="form1" :rules="rules">
  <!-- form1的表单项 -->
</el-form>
 
<el-form ref="form2" :model="form2" :rules="rules">
  <!-- form2的表单项 -->
</el-form>
 
<el-button @click="validateForms">验证表单</el-button>

在你的Vue组件中，你可以定义一个方法来验证这两个表单：

export default {
  data() {
    return {
      form1: {},
      form2: {},
      rules: {
        // 验证规则
      }
    };
  },
  methods: {
    validateForms() {
      let promises = [];
      promises.push(this.$refs.form1.validate());
      promises.push(this.$refs.form2.validate());
 
      Promise.all(promises).then(() => {
        console.log('两个表单验证通过');
        // 继续你的逻辑
      }).catch(() => {
        console.log('至少有一个表单验证失败');
      });
    }
  }
};

在上面的代码中，validateForms方法会验证form1和form2。它通过this.$refs.form1.validate()和this.$refs.form2.validate()来触发验证，并使用Promise.all来确定两个表单是否都通过了验证。如果所有的验证都通过，则在.then()方法中执行后续逻辑；如果任何一个验证失败，则在.catch()方法中处理错误。