更新记录

0.1.1(2026-07-31) 下载此版本

  • 修复竖向纯分割线高度塌缩:纯竖线改为根节点自身绘制(对齐 nax-line)
  • 新增 length:竖向高度;纯竖线默认 100%(父级需有明确高度)
  • demo 补充「拉满容器」与「与文字并排 length」两种竖向用法

平台兼容性

uni-app x(4.25)

Chrome Safari Android iOS 鸿蒙 微信小程序
-

其他

多语言 暗黑模式 宽屏模式
× ×

nax-divider

内容分割线(可带文字)。纯线条请用 nax-line

用法

<nax-divider></nax-divider>
<nax-divider text="或者"></nax-divider>
<nax-divider text="左侧" content-position="left"></nax-divider>
<nax-divider dashed text="虚线" type="primary"></nax-divider>

<!-- 竖向:父级固定高度时默认 height 100% 拉满 -->
<view style="height:120px;flex-direction:row;align-items:stretch;">
  <text>左</text>
  <nax-divider direction="vertical" space="12"></nax-divider>
  <text>右</text>
</view>

<!-- 与文字并排:用 length 指定高度 -->
<view style="flex-direction:row;align-items:center;">
  <text>左</text>
  <nax-divider direction="vertical" length="16" space="10"></nax-divider>
  <text>右</text>
</view>

Props

属性 类型 默认 说明
direction string horizontal horizontal / vertical
text string '' 中间文案;有值时显示两侧线夹文字
content-position string center left / center / right
dashed boolean false 虚线
size string hairline hairline / sm / md
type string default 语义色
color string '' 自定义线色
text-color string '' 自定义文案色
space string '' 外边距(横=上下,竖=左右)
length string 竖向纯线默认 100% 竖向高度;纯数字按 px
custom-class string '' 根节点扩展 class

插槽

名称 说明
default 自定义中间内容(需同时提供 text 以开启中间区,可用 text=" "

依赖

  • nax-ui-theme(可选)

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

暂无用户评论。