el-form 循环校验

对于 el-form 的循环校验，你可以考虑使用 el-form 的 validate 方法和 el-form-item 的 prop 属性来实现。

首先，在 el-form 的外层套上一个 v-for 循环，循环渲染多个 el-form-item。在 el-form-item 中，设置不同的 prop 值，以便在校验时能区分不同的表单项。

接下来，在 el-form 中的某个按钮的点击事件中，可以通过调用 el-form 的 validate 方法来触发校验。validate 方法会遍历所有的 el-form-item，并根据各自设置的 prop 值进行校验。

下面是一个示例代码：

<template>
  <el-form :model="form" ref="myForm" :rules="rules" label-width="100px">
    <el-form-item v-for="(item, index) in formItems" :key="index" :prop="'item' + index">
      <el-input v-model="formItems[index]" placeholder="请输入内容"></el-input>
    </el-form-item>
    <el-button type="primary" @click="submit">提交</el-button>
  </el-form>
</template>

<script>
export default {
  data() {
    return {
      form: {},
      formItems: ['', '', ''], // 假设有三个表单项
      rules: {
        item0: { required: true, message: '请输入内容', trigger: 'blur' },
        item1: { required: true, message: '请输入内容', trigger: 'blur' },
        item2: { required: true, message: '请输入内容', trigger: 'blur' }
      }
    };
  },
  methods: {
    submit() {
      this.$refs.myForm.validate((valid) => {
        if (valid) {
          // 校验通过，执行提交操作
          // ...
        } else {
          // 校验不通过，给出提示
          this.$message.error('请完整填写表单');
        }
      });
    }
  }
};
</script>

在示例中，我们使用 v-for 循环渲染了三个 el-form-item，并设置了不同的 prop 值。在 rules 中也对每个表单项设置了校验规则。

在 submit 方法中，我们通过调用 el-form 的 validate 方法来进行校验，传入一个回调函数，在回调函数中判断校验结果。校验通过时，可以执行提交操作；校验不通过时，给出相应的提示。

希望这个示例能帮到你！如果还有其他问题，请随时提问。