### 组件名`ele-toolbar`,v1.6.0 新增,高级表格的表头工具栏使用的就是该组件,当然你也可以独立使用此组件,使用方式:
```
<template>
<ele-toolbar title="我是标题">
<!-- 默认插槽添加左边内容 -->
<a-button type="primary">添加</a-button>
<a-button type="danger">删除</a-button>
<!-- action插槽添加右边内容 -->
<template #action>
<a-space class="ele-tool">
<!-- 右侧图标按钮 -->
<ele-tool-item title="我是按钮" @click="alert('Hello')">
<plus-outlined />
</ele-tool-item>
</a-space>
</template>
</ele-toolbar>
</template>
<script lang="ts" setup>
import { PlusOutlined } from '@ant-design/icons-vue';
</script>
```
属性列表:
| 属性 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| title | 标题 | String | |
| subTitle | 二级标题 | String | |
| theme | 主题,可选'none'、'default' | String | 'none' |
主题设置为 'default' 会带有背景色,并且右侧的图标按钮带有边框。
ele-tool-item 组件也是 v1.6.0 新增,可以通过默认插槽加图标,支持的事件有 click,支持的属性有:
| 属性 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| title | tooltip的title属性 | String | |
| placement | tooltip的placement属性 | String | |
| disabled | 是否禁用tooltip | Boolean | false |
对于 v1.6.0 之前的版本可以通过加 class 来实现与默认工具按钮外观一致的图标按钮:
```
<div class="ele-tool-item">
<a-tooltip title="我是按钮">
<plus-outlined @click="alert('Hello')"/>
</a-tooltip>
</div>
```