在vue.js中设置el-input和el-select行数组元素的焦点？

Question

我在按元素设置焦点行数组时遇到问题，我不为什么不能像下面的代码和图片那样设置焦点。我按元素本身单击单元格。请推荐并解决我的问题。

df[df.eq({'x':1,'y':2}).groupby(level=0).transform('any').any(1)]
     x  y
A B      
a b  1  2
  f  4  5
  c  3  4
b d  1  5
  c  1  2

我尝试了//Template <!-- Qty --> <el-table-column v-if="showActiveHeader('qty')" prop="qty" label="Qty" > <template slot-scope="scope"> <el-form-item v-if="scope.$index === activeRowIndex" :key="scope.$index + '.qty'" :prop="'items.' + scope.$index + '.qty'" :rules="rules.qty" class="form-item" style="margin:0" > <el-input-number ref="Qty" v-model="scope.row.qty" :precision="decimalNumber" :controls="false" :size="formSize" :min="minQty" style="width:100%" @change="rowChange(scope.row, 'Qty')" /> </el-tooltip> </el-form-item> <span v-else> {{ scope.row.qty | number }} </span> </template> </el-table-column> <!-- Unit --> <el-table-column v-if="showActiveHeader('unit')" prop="unitId" label="Unit" > <template slot-scope="scope"> <el-form-item v-if="scope.$index === activeRowIndex" :key="scope.$index + '.unitId'" :prop="'items.' + scope.$index + '.unitId'" :rules="rules.unitId" class="form-item" style="margin:0" > <el-select ref="Unit" v-model="scope.row.unitId" automatic-dropdown :size="formSize" filterable @change="rowChange(scope.row, 'Unit')" > <el-option v-for="doc in scope.row.units" :key="doc.unitId" :label="doc.unitDoc.name" :value="doc.unitId" :disabled="doc.disabled" /> </el-select> </el-form-item> <span v-else> {{ scope.row.unitLabel }} </span> </template> </el-table-column> //vue js handleCellClick(row, column) { this.activeRowIndex = this.form.items.indexOf(row) this.$nextTick(() => { let label = column.label this.$refs[label].focus() }) } ，以便可以在网上找到用于定位焦点的内容，但是this.$els.nameInput.focus();无效。

Answer 1

v-el已替换/合并到vue2中的ref中，请尝试使用$ refs而不是$ els

https://vuejs.org/v2/guide/migration.html#v-el-and-v-ref-replaced