使用vue+element-ui实现子表格的单击可编辑

无循环读取数据
实现方法:使用slot-scope="{row,$index}"来获取行的索引值,单击改行,则更改可修改状态editable[$index]。单击时,显示input,其他状态用span显示数据。
template:

 
        
    

数据:

editable:[]

方法:

 changeNum(row){
                this.editable[row] = true;
                this.$set(this.editable,row,true)
            },
        }

循环读取数据
不同点:
1、使用来获取索引值,方法中的索引值表示为index;
2、不用使用slot-scope。

你可能感兴趣的:(使用vue+element-ui实现子表格的单击可编辑)