WTableV2 组件
虚拟化表格组件,基于 WinDesignNext Table V2 封装,适用于大数据量表格场景,通过虚拟滚动提升渲染性能。
与 WTable 的区别:WTableV2 使用
columns属性定义列(非 WTableColumn 子组件),且必须设置width和height;WTable 适合中小数据量及需要自定义单元格渲染的场景。
基础用法
API
| 属性 | 类型 | 说明 |
|---|---|---|
component | string | 固定为 WTableV2 |
dataSource | string | 行数据路径,与 data 二选一 |
data | array | 静态行数据 |
columns | array | 列定义,与 columnsSource 二选一 |
columnsSource | string | 列定义路径 |
width | number | DataBindingValue | 表格宽度(必填) |
height | number | DataBindingValue | 表格高度(必填) |
rowHeight | number | DataBindingValue | 行高,默认 32 |
rowKey | string | 行唯一标识字段,默认 id |
fixed | boolean | 固定表头 |
stripe | boolean | 斑马纹 |
path 支持说明
| 属性 | path 支持 | 说明 |
|---|---|---|
dataSource | ✅(路径字符串) | 行数据数组路径 |
columnsSource | ✅(路径字符串) | 列定义数组路径 |
width | ✅ | 表格宽度 |
height | ✅ | 表格高度 |
maxHeight | ✅ | 最大高度 |
rowHeight | ✅ | 行高 |
dataSource 动态数据
json
{
"component": "WTableV2",
"width": 600,
"height": 400,
"dataSource": "/patients",
"columns": [
{ "key": "name", "title": "姓名", "dataKey": "name", "width": 120 }
]
}与 WTable 对比
| 特性 | WTable | WTableV2 |
|---|---|---|
| 列定义 | WTableColumn 子组件 | columns 属性 |
| 单元格自定义 | 支持 children 模板 | 仅 dataKey 文本渲染 |
| 大数据量 | 一般 | 虚拟滚动,性能更好 |
| 必填尺寸 | 无 | width + height |
注意事项
columns每项必须包含key、title、dataKey、width- 不支持 WTableColumn 子组件及
@row.*自定义单元格渲染 - A2UI JSON 不支持
sortBy、rowClass等函数属性