Divider 分割线
分割线组件,用于分隔内容区块。
何时使用:需要在视觉上分隔两个内容区块时使用。
基础用法
虚线
带文字
垂直分割线
用于按钮组、面包屑等内联场景。
API
Props
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
vertical | boolean | false | 是否为垂直分割线 |
dashed | boolean | false | 是否为虚线 |
Slots
| 名称 | 说明 |
|---|---|
default | 分割线中间的文字(仅水平模式) |
注意事项
- 水平分割线默认占据整行,上下间距为
--ui-spacing-xl - 垂直分割线用于内联场景,高度为
1em,与文字对齐 - 带文字的分割线使用
::before和::after伪元素实现,无需额外 DOM 结构