需求是在表头自定义添加数据的方法,用table-column直接绑定@click事件不生效,即使成功了也不美观,尝试将表头做成添加的按钮

查询文档,发现一个很有意思的属性——

尝试几次后成功实现
<el-table-column
label="Operate"
width="80"
align="center"
>
<template slot="header"> //header插槽实现表头自定义
<el-button
icon="el-icon-plus"
circle
@click="openAdd"
/>
</template>
<template slot-scope="scope">
<el-button
type="primary"
size="mini"
@click="handleEdit(scope.row.id)"
>
编辑
</el-button>
<br>
<el-button
type="info"
size="mini"
@click="handleDelete(scope.row.id)"
>
删除
</el-button>
</template>
</el-table-column>效果如下:


