<el-table:d ata= "Tabledata"
Class= "Tb-edit"
Style= "width:100%"
ref= "Multipletable"
@selection-change= "Handleselectionchange"
Highlight-current-row
@cell-dblclick= "Dblhandlecurrentchange"
>
Dblhandlecurrentchange (row, column, cell, event) {
Switch (Column.label) {
Case "Longitude (°)":
Row.longitudeflag = true;
Break
Case "Latitude (°)":
Row.dimensionflag = true;
Break
Case "distance (m)":
Row.heightflag = true;
Break
}
},
Focus needs to add the following code in the public JS inside:
Vue.directive (' Focus ', function (el, option) {
var defclass = ' El-input ', Deftag = ' input ';
var value = Option.value | | True
if (typeof value = = = ' Boolean ')
Value = {Cls:defclass, tag:deftag, foc:value};
Else
Value = {Cls:value.cls | | defclass, TAG:VALUE.TAG | | deftag, FOC:VALUE.FOC | | false};
if (El.classList.contains (VALUE.CLS) && VALUE.FOC)
El.getelementsbytagname (Value.tag) [0].focus ();
});
Lost focus Method:
Inputblur (Row, event, column) {
Let tabled = This.tabledata;
Tabled.foreach (function (item) {
Item.longitudeflag = false;
Item.dimensionflag = false;
Item.heightflag = false;
});
},
Vue elementui Table Double-click a cell for editing, focusing, losing focus, showing hidden input and span