elementui table 动态列,el-table动态生成列

　　这篇文章主要介绍了某视频剪辑软件如何动态修改埃尔表的某列数据，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教

目录

　　 动态修改埃尔表的某列数据设置埃尔表某一列点击出现输入框可以编辑

动态修改el-table的某列数据

　　1.对话框打开时调用函数open@opened=checked

　　2.可编辑

　　埃尔-表格-列

　　-

　　visEdit=true

　　3.同步选中的数据列表：多重选择，函数选中：函数()

设置el-table某一列点击出现输入框可以编辑

　　设置埃尔表某一列点击出现输入框可以编辑，鼠标失去输入框焦点时输入框消失，显示对应的值。

　　如下图所示：

　　具体实现：

　　El-table:data= table data v-loading= loading :row-class-name= tablerow class name border max-height= 780 style= width:100% size= mini @ cell-click= tab click

　　埃尔-表格-列标签=顺序吸附的

　　模板槽-范围="范围"

　　span v-if= scope。划。索引===选项卡点击索引选项卡点击标签==顺序

　　El-input v-model= scope。划。 absort type= number maxlength= 20 placeholder=请输入顺序size= mini @ blur= input blur(scope。行)/

　　/span

　　span v-else { { scope。划。absort } }/span

　　/模板

　　/El-表格-列

　　/el-table

　　通过tableRowClassName设置每一行的索引：

　　tableRowClassName ({ row，rowIndex }) {

　　//把每一行的索引放进排

　　row.index=rowIndex

　　}

　　行点击事件，当某一行被点击时，该行的某列设置tabClickIndex:

　　由于

　　v-if= scope。划。索引===选项卡点击索引选项卡点击标签==顺序

　　所以当前点击行的某列会出现输入框：

　　//tabClick行当前行圆柱当前列

　　制表符点击(行、列、单元格、事件){

　　开关(column.label) {

　　案例顺序：

　　this.tabClickIndex=row.index

　　这个。选项卡单击标签=列。标签

　　破裂

　　默认：返回

　　}

　　console.log(tabClick ，this.tabClickIndex，row.adName，row.adSort)

　　}

　　鼠标失焦事件：

　　//失去焦点初始化

　　输入模糊(行){

　　//console.log(row ，row)

　　this.tabClickIndex=null

　　this.tabClickLabel=

　　}

　　以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。