element-ui动态添加prop验证

注意看prop

  <!-- 组织 -->
                    <div v-for="(org,index) in orgArrOptions" :key="index">
                      <el-form-item :label="org.orgName"
                                    :prop="`userEntitiesModel[${index}]`"
                      >
                        <div class="block">
                          <el-cascader :ref="org.id" v-model="addHandflowEntity.userEntitiesModel[index]" :show-all-levels="false" :options="org.childNode" :props="props"
                                       clearable filterable style="width:100%"
                          >
                            <template slot-scope="{ node, data }">
                              <span>{
     {
      data.orgName }}</span>
                              <span v-if="!node.isLeaf">
                                ({
     {
      data.childNode.length }}) </span>
                              <span v-else>({
     {
      data.users.userPosition }})</span>
                            </template>
                          </el-cascader>
                        </div>
                      </el-form-item>
                    </div>

动态添加rules

  // 动态添加验证规则
    addRule() {
     
      this.orgArrOptions.forEach((item, index) => {
     
        this.rules[`userEntitiesModel[${
       index}]`] = [{
     
          required: true, message: '请输入人员', trigger: 'change'
        }]
      })
      this.rules = JSON.parse(JSON.stringify(this.rules)) // 转成响应式数据
    }