el-tab-pane下的表单无法重置

Question

已解决
已解决
已解决

<el-tabs v-model="factory" type="card" @tab-click="tabHandleClick">
  <el-tab-pane
    v-for="(tab,index) in tabs" 
    :key="index"
    :label="tab.label"
    :name="tab.name"
  >
     <el-form
      inline
      size="mini"
      ref="form"
      :model="table.searchCriteriaModel"
      @submit.native.prevent="handleSearchSubmit"
    >
    .....
    </el-form>
 </el-tab-pane>
</el-tabs>


tabHandleClick(tab) {
  this.factory = tab.name;
  this.table.query.page = 1;
  // 重置表单
  const index = Number(tab.name);//tab的name分别为：'1','2','3','4'
  this.$refs.form[index-1].resetFields();
  this.getList();
},

Answer 1

this.$refs.form[index-1].resetFields();

在refs中form[index-1]找不到，并没有动态绑定ref所以没办法重置，在refs中只有一个from的元素，你可以打印（this.$refs）出来看一下。