Table 表格 - 自定义插槽模板

通过插槽可以在表格的不同位置插入自定义内容，例如表格上方的工具栏、左侧/右侧操作区域等。

自定义左侧模板

通过 #toolbar-left 插槽在表格上方左侧区域放置操作按钮和搜索框，这是最常用的工具栏插槽。

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区
3	王五	25	设计部	离职	广州市天河区
4	赵六	35	运营部	在职	深圳市南山区

自定义左侧模板

自定义左侧前缀模板

通过 #toolbar-left-prefix 插槽在左侧操作按钮前面插入内容，如标题、图标等。

📋 员工列表

姓名	年龄	部门	状态	地址

张三	28	技术部	在职	北京市朝阳区
李四	32	产品部	在职	上海市浦东新区
王五	25	设计部	离职	广州市天河区
赵六	35	运营部	在职	深圳市南山区

自定义左侧前缀模板

自定义左侧后缀模板

通过 #toolbar-left-suffix 插槽在左侧操作按钮后面追加内容，如数据统计等。

共 4 条记录

姓名	年龄	部门	状态	地址

张三	28	技术部	在职	北京市朝阳区
李四	32	产品部	在职	上海市浦东新区
王五	25	设计部	离职	广州市天河区
赵六	35	运营部	在职	深圳市南山区

自定义左侧后缀模板

自定义右侧模板

通过 #toolbar-right 插槽在表格上方右侧放置操作按钮，如刷新、导出、打印、设置等。

姓名	年龄	部门	状态	地址

张三	28	技术部	在职	北京市朝阳区
李四	32	产品部	在职	上海市浦东新区
王五	25	设计部	离职	广州市天河区
赵六	35	运营部	在职	深圳市南山区

自定义右侧模板

自定义右侧前缀模板

通过 #toolbar-right-prefix 插槽在右侧操作按钮前面插入内容，如状态提示等。

⚠️ 有 1 条待审核

姓名	年龄	部门	状态	地址

张三	28	技术部	在职	北京市朝阳区
李四	32	产品部	在职	上海市浦东新区
王五	25	设计部	离职	广州市天河区
赵六	35	运营部	在职	深圳市南山区

自定义右侧前缀模板

自定义右侧后缀模板

通过 #toolbar-right-suffix 插槽在右侧操作按钮后面追加内容，如同步状态等。

✅ 已同步

姓名	年龄	部门	状态	地址

张三	28	技术部	在职	北京市朝阳区
李四	32	产品部	在职	上海市浦东新区
王五	25	设计部	离职	广州市天河区
赵六	35	运营部	在职	深圳市南山区

自定义右侧后缀模板

完整工具栏示例

组合使用所有 6 个工具栏插槽，构建完整的表格工具栏布局。

📋 员工管理

共 4 人

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区
3	王五	25	设计部	离职	广州市天河区
4	赵六	35	运营部	在职	深圳市南山区

完整工具栏

插槽布局说明

工具栏区域分为左右两部分，每部分各有 3 个插槽位：

┌──────────────────────────────────────────────────────────────────┐
│ [left-prefix] [left] [left-suffix]   [right-prefix] [right] [right-suffix] │
├──────────────────────────────────────────────────────────────────┤
│                           表格内容区域                              │
└──────────────────────────────────────────────────────────────────┘

API

工具栏插槽

插槽名	说明	位置
toolbar-left	左侧工具栏主内容	左侧
toolbar-left-prefix	左侧工具栏前缀（如标题）	左侧最前
toolbar-left-suffix	左侧工具栏后缀（如统计）	左侧最后
toolbar-right	右侧工具栏主内容	右侧
toolbar-right-prefix	右侧工具栏前缀（如提示）	右侧最前
toolbar-right-suffix	右侧工具栏后缀（如状态）	右侧最后
empty	空数据状态自定义内容	表格内部

使用建议

1. 左侧 通常放置操作按钮：新增、批量删除、搜索等
2. 右侧 通常放置工具按钮：刷新、导出、打印、列设置等
3. 前缀 适合放置标题、图标等静态内容
4. 后缀 适合放置统计信息、状态指示等辅助信息
5. 所有插槽均可自由组合使用，未使用的插槽不会渲染额外空间