视图
视图描述表格以何种方式呈现给用户。视图可以隐藏字段或调整字段顺序,也可以筛选、排序和分组记录,并能为网格、看板、日历、甘特图或画廊设置各自的专用配置。
视图快照
| 属性 | 类型 | 说明 |
|---|---|---|
| id | string | 视图 ID。 |
| tableId | string | 所属表的 ID。 |
| name | string | 视图名称。 |
| type | BaseViewType | grid, kanban, calendar, gantt, gallery, pivot. |
| fieldOrder? | string[] | 该视图中的字段顺序。 |
| fieldSettings? | Record\<string, IViewFieldSetting\> | 各字段的可见性、宽度和卡片设置。 |
| filter? | `IFilterConfig | null` |
| sort? | ISortConfig[] | 排序规则。 |
| group? | IGroupConfig[] | 分组规则。 |
| config | ViewSpecificConfig | 该视图类型专用的配置。 |
视图类型
| 类型 | 使用场景 |
|---|---|
grid | 以类似电子表格的方式编辑表格。 |
kanban | 按选择、人员、组、文本或日期字段对卡片分组。 |
calendar | 根据日期字段排列记录。 |
gantt | 使用开始日期和结束日期字段进行时间线规划。 |
gallery | 以卡片布局展示侧重视觉或内容较多的记录。 |
pivot | 由仪表盘插件提供,用于汇总与图表。 |
创建视图
TypeScript
const view = table.createView('Kanban', univerAPI.Enum.BaseViewType.Kanban)配置筛选与排序
TypeScript
view.setFilter({ conjunction: univerAPI.Enum.BaseFilterConjunction.AND, conditions: [ { fieldId: 'status', operator: univerAPI.Enum.BaseFilterOperator.IS, operand: 'In progress', }, ],})view.setSort([ { fieldId: 'dueDate', direction: univerAPI.Enum.BaseSortDirection.ASC },])字段可见性与宽度
TypeScript
view.setFieldVisible('internalNotes', false)view.setFieldWidth('title', 280)你觉得这篇文档如何?