n-divider 分割线
区隔内容的分割线：横向为「线 - 内容 - 线」三段式，文字嵌在两线之间（position 三档位置，dot 圆点形态替代文字做极简分隔）；竖向（direction="col"）为纯线条，用于表单行、卡片分栏的左右内容分隔。线形支持实线 / 虚线、常规 / 细线两档，文字与线色独立定制，width 传定宽得居中的装饰性短分隔形态。
- 零配置即用：
<n-divider />出全宽细分割线；嵌文字<n-divider text="没有更多了" />，文字位置 / 加粗 / 字号 / 颜色独立可调- 极简分隔：
dot圆点替代文字；dashed虚线、line-color独立调线色- 竖向分栏：
direction="col"纯竖线（高度默认拉满父容器，custom-style="height:32px"定高）
平台兼容性
| App | H5 | 微信小程序 | 支付宝小程序 | 百度小程序 | 头条小程序 | QQ小程序 |
|---|---|---|---|---|---|---|
| √ | √ | √ | × | × | × | × |
如何调用
html
<n-divider />API
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| text | string | "" | 文字内容；留空且无插槽内容时为纯分割线（两侧线占满）。竖向时不生效 |
| position | string | "center" | 文字水平位置：left 靠左（左侧短线定宽）/ center 居中 / right 靠右（右侧短线定宽）。竖向时不生效 |
| dot | boolean | false | 以圆点替代文字的极简分隔形态（优先于 text 与插槽；颜色跟随 color） |
| bold | boolean | false | 文字加粗 |
| size | number | 12 | 文字字号（px） |
| color | string | "" | 文字颜色（dot 圆点同用此色）；空 = 次要文字色（跟随主题） |
| lineColor | string | "" | 线颜色；空 = 分割线色（跟随主题）。竖向为竖线颜色 |
| dashed | boolean | false | 虚线 |
| hairline | boolean | true | 细线（微信 / H5 端 0.5px 观感；App 端保持 1px 由浅色默认减重） |
| width | string | "" | 内容区定宽（如 "200px" / "60%"）：留空占满容器宽；传值后整体居中。竖向时不生效 |
| direction | string | "row" | 线方向：row 横向（默认，可嵌文字）/ col 竖向（纯线） |
| customClass | string | "" | 挂到根节点的额外 class（类需定义在组件样式表内） |
| customStyle | string | "" | 根节点行内样式：排间距（如 "margin:15px 0"）与竖向定高（如 "height:32px"）走它 |
事件
| 事件名 | 说明 |
|---|---|
| click | 点击组件时触发（分割区整块响应，如点击触发刷新） |
插槽
| 插槽名 | 说明 |
|---|---|
| default | 与 text 并排的内容（图标等）；dot 开启时不渲染 |
主题令牌
| 令牌 | 默认值 | 说明 |
|---|---|---|
| --n-divider-gap | 12px | 内容盒与线的水平间距 |
| --n-divider-side-width | 40px | position=left / right 时定宽侧线的宽度 |
| --n-divider-dot-size | 5px | dot 圆点直径 |
线色与文字色默认值直接跟随主题令牌 --n-border / --n-text-2（随深浅主题自动切换），不设组件独立色令牌。
实现说明
与参考实现对照的取舍（同类组件功能面取并集、冲突从使用者视角择优融合）
| 机制 | 参考做法 | 本库做法 | 分歧理由 |
|---|---|---|---|
| 文字位置 | 左线定宽 40px、右线拉伸（flex 互斥） | 相同机制（--lead / --tail 定宽类） | 内容靠边语义的最小实现 |
| 圆点分隔 | 文字符号 ●（12px 字形） | view 圆（5px 令牌直径） | 规避各端字体字形差异，几何可控 |
| 细线 | transform scaleY(0.5) 全端 | 微信 / H5 缩放，App 端保持 1px | App 端实心 view 缩放渲染不可靠（本库列表分隔线实证），由浅色默认减重 |
| 线画法 | border 或 background 色块 | border（实 / 虚统一画法） | 虚线只有 border-style 可表达 |
| 虚线 | border-style: dashed 类切换 | 相同 + :key 收拢形态 | App 端类切换样式更新可能不重绘，重建节点绕开 |
| 竖向 | 独立线条组件（纯线） | 并入 direction="col" | 竖线即无文字的分割线，单组件收口 |
| 默认宽度 | 定宽 400rpx 居中（装饰形态） | 留空占满容器宽，width 传值得定宽形态 | 全宽是分割语义常态，定宽为补充形态 |
| 垂直占位 | 组件自带 margin 15px 0 / 占高 100rpx | 零外边距，间距走 custom-style | 间距归使用方管节奏（与卡片 / 列表行组件同纪律） |
| 插槽与文字 | 插槽覆盖文字 / 仅插槽 | 二者并排同盒（插槽在前，text 自动补间距） | 图标 + 文字组合（热门推荐等）高频，覆盖语义丢信息 |
| 不收项 | 线长 length / 线外距 margin / 数值型 fontWeight | 长度走容器与 custom-style，间距同；加粗用 bold 布尔 | 等价能力已有通道，不另设平行 prop |