Table 表格 - 自定义模板
Table 组件支持自定义列内容和表头。
自定义列模板
通过插槽自定义列的渲染内容，插槽名为列的 prop 值。
日期 | 姓名 | 状态 | 标签 |
|---|
2024-01-01 | 张三 | success | 家 |
2024-01-02 | 李四 | warning | 公司 |
2024-01-03 | 王五 | danger | 学校 |
2024-01-04 | 赵六 | info | 家 |
自定义列模板
自定义表头
通过 header-[prop] 插槽自定义表头内容。
日期 | 👤 姓名 | 状态 | 标签 |
|---|
2024-01-01 | 张三 | success | 家 |
2024-01-02 | 李四 | warning | 公司 |
2024-01-03 | 王五 | danger | 学校 |
2024-01-04 | 赵六 | info | 家 |
自定义表头
操作列
添加操作按钮列，用于编辑、删除等操作。
日期 | 姓名 | 操作 |
|---|
2024-01-01 | 张三 | |
2024-01-02 | 李四 | |
2024-01-03 | 王五 | |
2024-01-04 | 赵六 |
操作列
格式化显示
通过列的 formatter 函数格式化单元格内容。
姓名 | 金额 |
|---|
张三 | ¥1000.00 |
李四 | ¥2500.00 |
王五 | ¥800.00 |
赵六 | ¥3200.00 |
格式化显示
render 函数
通过列的 render 函数使用 JSX/h 函数渲染自定义内容。
姓名 | 状态 |
|---|
张三 | success |
李四 | warning |
王五 | danger |
赵六 | info |
render 函数