vue可填写表格_vue表格中添加一条数据且可编辑

1.vue中在数据表格中添加一行，可直接在表格中编辑；

最后出来的图片：

直接来代码：

表格代码:

height="310"

:data="tableData"

style="width: 98%;margin-left: 10px">

{{scope.$index + 1}}

{{scope.row.sysName}}

{{scope.row.platformName}}

{{scope.row.type}}

{{scope.row.length}}

{{scope.row.context}}

操作

icon="el-icon-delete">删除

编辑

保存

methods: {

// 保存

save1(row) {

row.show = false

},

// 添加点击按钮

handleAdd() {

this.tableData.push({

sysName: '',

platformName: '',

context: '',

show: true

})

},

handleDelete(index) {

this.tableData.splice(index, 1)

}

}