u-form-item循环数组校验

u-form-item是Element UI中的一个表单组件，它可以对表单项进行校验。如果你需要对一个循环数组进行校验，可以使用Element UI中的表单数组组件u-form-item，具体实现方式如下：
1. 在表单中使用u-form-item时，将其设置为数组类型，并且使用v-for指令循环渲染表单项；
2. 在u-form-item组件中使用validate事件，在事件处理函数中对循环数组中的每个表单项进行校验；
3. 对于每个表单项，可以使用v-model指令和prop属性来绑定数据和校验规则。

下面是一个简单的示例代码：

<template>
  <el-form :model="form" ref="form" :rules="rules" label-width="100px">
    <el-form-item label="循环数组">
      <div v-for="(item, index) in form.items" :key="index">
        <el-input v-model="item.name" :name="'items.' + index + '.name'" placeholder="请输入名称"></el-input>
        <el-input v-model="item.value" :name="'items.' + index + '.value'" placeholder="请输入值"></el-input>
      </div>
    </el-form-item>
    <el-button type="primary" @click="submitForm">提交</el-button>
  </el-form>
</template>

<script>
export default {
  data() {
    return {
      form: {
        items: [
          { name: '', value: '' },
          { name: '', value: '' },
          { name: '', value: '' },
        ],
      },
      rules: {
        items: [
          { type: 'array', required: true, message: '请输入循环数组', trigger: 'blur' },
          {
            type: 'array',
            validator: (rule, value, callback) => {
              for (let i = 0; i < value.length; i++) {
                const item = value[i];
                if (!item.name || !item.value) {
                  callback(new Error(`请输入第${i + 1}个数组项的名称和值`));
                  return;
                }
              }
              callback();
            },
            trigger: 'blur',
          },
        ],
      },
    };
  },
  methods: {
    submitForm() {
      this.$refs.form.validate(valid => {
        if (valid) {
          console.log('submit');
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
  },
};
</script>