实现element表格(table)组件表头自定义

需求是在表头自定义添加数据的方法，用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>

效果如下：