el-form表单校验----循环el-select控件元素手动触发校验

项目场景：

遇到多个选择下拉框校验问题，尝试普通自动校验无果。

---

问题描述

第一层级可以触发校验，正常~

<el-form prop='productname'>
    <el-select 
      v-model="productMaterial.productname" 
      placeholder="请选择" 
      filterable>
    </el-select>
</el-form>

第二层级无法校验，此时prop为el-form校验查询的路径，prop存在问题

<div v-for="(typeItem,typeKey) in productMaterial.attachmentTypeList">
     <el-form-item :label="`附件类型${typeKey +1}`"  :prop="type" >
        <el-select  v-model="typeItem.type" >
         </el-select>
     </el-form-item>
</div>

---

解决方案：

请教大佬后得知了一个解决方案，如下

<div v-for="(typeItem,typeKey) in productMaterial.attachmentTypeList">
  <el-form-item 
    :label="`附件类型${typeKey +1}`" 
    :prop="`attachmentTypeList.${typeKey}.type`" 
    @blur.capture.native="onblur('productMaterial',`attachmentTypeList.${typeKey}.type`)"
    :rules="rules.type">
    <el-select 
      v-model="typeItem.type" >
    </el-select>
  </el-form-item>

onblur(ref,type){
  this.$refs[ref].validateField(type)
},

此时，完美解决不能触发校验的问题。