实现的样式:

Element 表格携带参数, 实现编辑删除操作_ci

实现操作部分的template代码

<el-table-column align="center" width="150" label="操作">
<template slot-scope="scope">
<el-button
type="primary"
icon="el-icon-s-tools"
circle
size="small"
@click="update(scope.$index, scope.row)"
>
</el-button>
<el-button
type="warning"
icon="el-icon-delete"
circle
size="small"
@click="handleDel(scope.$index, scope.row)"
></el-button>
</template>
</el-table-column>

主要代码:

<template slot-scope="scope">
@click="update(scope.$index, scope.row)"

修改和删除部分

//点击删除按钮触发
handleDel(index, row) {
// console.log(index+1);
console.log(row);
console.log("ID:", row.id);
},
//点击修改按钮触发
update(index, row) {
console.log(row);
this.dialogFormVisible = true;
},

这里打印携带的数据