循环的form表单，页面有值，错误提示不消失，怎么设置每一项的prop

Question

```html
<div :slot="'slot_'+i" v-for="(val,i) in lists" :key="i">
          <el-form
            :label-position="labelPosition"
            :model="val.userFormData"
            :rules="rules"
            :ref="'userFormData'+i"
          >
            <div class="Modelform">
              <el-form-item label="业务范围：" prop="userScope" class="user-type">
                <el-select
                  v-model="val.userFormData.userScope"
                  placeholder="请选择"
                  @change="changeUserType(i)"
                >
                  <el-option label="仅本级机构" value="0"></el-option>
                  <el-option label="本级机构（含下级）" value="2"></el-option>
                  <el-option label="仅下级机构" value="1"></el-option>
                </el-select>
                <el-select
                  v-model="val.userFormData.idList"
                  :disabled="
                    val.userFormData.userScope == '0'
                      ? true
                      : val.userFormData.userScope == '2'
                      ? true
                      : false
                  "
                  multiple
                  placeholder="请选择"
                  style="margin-left: 10px"
                >
                  <el-option
                    v-for="(item, index) in val.oriOptions"
                    :key="index"
                    :label="item.oName"
                    :value="item.oid"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="登录方式：" prop="loginMode">
                <div>
                  <span>因子逻辑：</span>
                  <el-radio-group v-model="val.userFormData.loginType">
                    <el-radio label="0">单因子</el-radio>
                    <el-radio label="1">多因子</el-radio>
                  </el-radio-group>
                </div>
                <div>
                  <span>认证方式：</span>
                  <el-checkbox-group
                    v-model="val.userFormData.loginMode"
                    @change="changeLoginMode(i)"
                  >
                    <el-checkbox
                      v-for="item in val.loginModeOptions"
                      :label="item.value"
                      :key="item.value"
                      >{{ item.label }}</el-checkbox
                    >
                  </el-checkbox-group>
                </div>
                <div>
                  <span>因子顺序：</span>
                  <el-table :data="val.tableData" style="width: 100%">
                    <el-table-column
                      v-for="(item, index) in val.tMdata"
                      :key="item.value"
                      prop="key"
                      :label="String(index + 1)"
                      width="180"
                    >
                      <template slot-scope="scope">
                        <el-select
                          v-model="scope.row['key' + (index + 1)]"
                          value-key=""
                          @change="chooseAdminOnOff(i)"
                          @clear="chooseAdminOnOff(i)"
                          placeholder=""
                          clearable
                          filterable
                        >
                          <el-option
                            v-for="(t, i) in val.options"
                            :key="i"
                            :label="t.label"
                            :value="t.value"
                            :disabled="t.disabled"
                          >
                          </el-option>
                        </el-select>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>

rules: {
        userScope: [
          { required: true, message: "请选择业务范围", trigger: "change" },
          { validator: checkUserScope, trigger: "change" },
        ],
        loginMode: [
          {
            type: "array",
            required: true,
            message: "请至少选择一个认证方式",
            trigger: "change",
          },
        ],
      },
      lists: [],
      loginModeOptions: [],
      options: [],
      tMdata: [],
      tableData: [
        {
          key1: null,
        },
      ],
      oriOptions: [],

图片地址
https://img-mid.csdnimg.cn/release/static/image/mid/ask/91814126992613.png 

Answer 1

Element通过v-for循环渲染的form表单校验_前端踩坑之路-CSDN博客_el-form v-for 普通的form表单校验日常业务开发中，对于中后台管理系统，form表单校验是一个很常见的问题。查阅Element官方文档，我们了解到，form表单校验是这样的，需要给所校验的el-form-item添加prop属性值，这个属性值便就是当前元素v-model 所绑定的值。如图所示：v-for 循坏的表单校验那么问题来了，通过v-for 遍历循环渲染的form表单怎么添加校验呢？主要问题就在... https://blog.csdn.net/weixin_36894745/article/details/104887795