参考
分栏面板 Splitter
Splitter：分割面板。面板沿一条发丝线分隔，小型纸色手柄响应用户拖动。部件：Root、Panel、ResizeTrigger、ResizeTriggerIndicator。
Root · Panel · ResizeTrigger · ResizeTriggerIndicator
#Panel
| 属性 | 类型 | 默认值 | 描述 |
|---|---|---|---|
id | PanelId | — |
#ResizeTriggerIndicator
纯造型的部件——自身没有属性，沿用部件结构的共享样式。
#ResizeTrigger
| 属性 | 类型 | 默认值 | 描述 |
|---|---|---|---|
disabled | boolean | undefined | — | |
id | ResizeTriggerId | — |
#Root
| 属性 | 类型 | 默认值 | 描述 |
|---|---|---|---|
defaultSize | number[] | 面板渲染时的初始尺寸；不需要控制面板尺寸时使用 | |
id | string | 组件内部状态机的唯一标识 | |
ids | Partial<{ root: string; resizeTrigger(id: string): string; label(id: string): string; panel(id: string | number): string; }> | splitter 各元素的 id，适合组合使用 | |
keyboardResizeBy | number | 使用键盘调整面板大小时每次改变的像素数 | |
nonce | string | 注入 splitter 光标样式表使用的 nonce | |
orientation | 'horizontal' | 'vertical' | "horizontal" | 分隔器的方向，可为 horizontal 或 vertical |
panels | splitter.PanelData[] | 各面板的尺寸约束 | |
registry | splitter.SplitterRegistry | 支持多拖拽的 splitter 注册表 | |
size | number[] | 受控的面板尺寸数据 |
| 事件 | 载荷 |
|---|---|
resize | details: ResizeDetails |
update:size | size: number[] |
expand | details: ExpandCollapseDetails |
collapse | details: ExpandCollapseDetails |
resizeEnd | details: ResizeEndDetails |
resizeStart | — |