---
url: /components/splitter.md
---
# Splitter 分隔面板

可拖拽的分栏容器：子面板 [SplitterPanel](#splitterpanel-props) 自渲染拖拽条，尺寸在 min/max 之间夹角互不越界，支持面板折叠与受控尺寸。

## 基础分栏

横向分栏（左右），拖中间的拖拽条调整比例：

## 纵向分栏与折叠

layout 取 `vertical` 上下分栏；`collapsible` 面板在拖拽条上出现折叠钮，点击把面板尺寸折叠进相邻面板：

## 受控尺寸与 resize 事件

面板传 `size` 即受控，外部改值后重新分摊；`resize` 在拖拽、折叠及初始化后回传各面板占比（如 `30.00%` 的字符串数组）：

## 嵌套分栏

Splitter 可嵌套使用（内层给满高度），组合出经典的三栏工作台布局：