El-table中El-input 動態綁定ref 並獲取焦點

 

 

一、表格需要加上：:row-class-name="tableRowIndex"
methods中: tableRowIndex({row, rowIndex}) { //把每一行的索引放進row
　　　　　　row.index = rowIndex;
　　　　　},

二、

<el-table-column label="名稱" width="180">
　　<template slot-scope="scope">
　　　　<el-input v-model="scope.row.Name" :ref="'Input_'+scope.$index"></el-input>
　　</template>
</el-table-column>

// ..每次添加一條信息時，自動將焦點聚焦到該行的名稱input上。
this.$nextTick(_ => {
　　if( this.list.length !== 0){
　　　　this.list.forEach( (item, index) => {
　　　　　　if( Number( index) === Number( this.list.length-1)) {
　　　　　　　　this.$refs['Input_'+Number((item.index))].focus(); // 將最后一行的名稱input框獲取焦點。
　　　　　　}
　　　　});
　　}
});