Table 表格
轻量数据表:列配置驱动,单元格可用作用域插槽自定义,空数据自动显示空状态。
基础用法
| 项目 | 负责人 | 进度 |
|---|---|---|
| 预约小程序 | 李工 | 80% |
| 企业官网 | 王工 | 45% |
| 数据看板 | 张工 | 12% |
自定义单元格
每列都有名为 cell-<key> 的作用域插槽,拿到 { row, value }:
| 任务 | 负责人 | 状态 |
|---|---|---|
| 聊天室消息引用 | 李李工 | 已完成 |
| 工程量导出 | 王王工 | 进行中 |
| 合同模板 | 张张工 | 待开始 |
空数据
rows 为空时显示内置空状态,可用 empty 插槽替换:
| 任务 | 状态 |
|---|
还没有任务
创建第一条任务开始协作
API
Props
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| columns | { key: string; title: string; width?: string; align?: 'left' | 'center' | 'right' }[] | — | 列配置(必填) |
| rows | Record<string, unknown>[] | — | 行数据(必填) |
| rowKey | string | 'id' | 行 key 字段名 |
Slots
| 名称 | 参数 | 说明 |
|---|---|---|
| cell-<key> | { row, value } | 对应列的单元格内容 |
| empty | — | 空数据占位(默认内置 EmptyState) |