У меня проблема с установкой массива строки фокуса по элементам. Я не понимаю, почему я не могу установить фокус, как показано в коде ниже и на рисунке.Я щелкаю по строке ячейки по самому элементу.Пожалуйста, порекомендуйте и решите мою проблему.
//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();
для того, что я мог найти в Интернете, чтобы нацелить фокус, но this.$els
не работает.