更新记录

0.1.5（2026-08-18） 下载此版本

  • 蒸汽模式兼容：lines CSS 声明迁移为 :max-lines 属性；下级选择器规则用 #ifndef VUE3-VAPOR 条件编译隔离（消除 "Invalid selector" 警告），VDOM/Web/小程序行为不变

0.1.3（2026-08-14） 下载此版本

  • 精简 readme：移除内部开发向内容（设计说明 / 实现细节 / 平台差异实现等），只保留安装、用法、API、主题等用户文档

0.1.1（2026-08-07） 下载此版本

  • 支持 iOS 端：组件为全端公共实现，无端差异代码，iOS 直接可用
查看更多

平台兼容性

uni-app x(4.25)

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

其他

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

nax-steps

步骤条。用于展示多步任务进度（物流、表单向导、审批等）。

组件

标签 说明
nax-steps 容器：方向、模式、当前步、语义色
nax-step 单步（组合式）；也可由 list 自动生成

主题

通过 CSS 变量覆盖：

Token 用途
--nax-color-bg 背景色
--nax-color-border 边框色
--nax-color-divider 分割线色
--nax-color-error 错误色
--nax-color-info 信息色
--nax-color-primary 主题主色
--nax-color-success 成功色
--nax-color-text 主文字色
--nax-color-text-secondary 次要文字色
--nax-color-text-tertiary 三级文字色
--nax-color-warning 警告色
--nax-opacity-disabled 禁用透明度

依赖

  • nax-icon
  • nax-ui-theme（可选，有 fallback）

基础用法（list）

<nax-steps :list="list" :current="1"></nax-steps>
const list = [
  { name: '下单' },
  { name: '出库' },
  { name: '运输' },
  { name: '签收' }
]

组合式

<nax-steps :current="1" direction="vertical">
  <nax-step title="提交申请" desc="2026-01-01"></nax-step>
  <nax-step title="审批中" desc="处理中"></nax-step>
  <nax-step title="完成" status="finish"></nax-step>
</nax-steps>

Props（nax-steps）

属性 类型 默认 说明
list array [] 项：name/title、desc/description、status、icon、disabled；也支持字符串
current number 0 当前步（从 0 起）；无显式 status 时推导
direction string horizontal horizontal / vertical（兼容 row / column）
mode string number number / dot
type string primary primary / info / success / warning / error
size string md sm / md / lg
icon string check 完成态默认图标
error-icon string close 失败态默认图标
clickable boolean false 是否可点击
custom-class string '' 根扩展 class

Props（nax-step）

属性 类型 默认 说明
title / name string '' 标题
desc / description string '' 描述
status string '' wait / process / finish / error；空则按 current 推导
icon string '' 本步完成态图标覆盖
disabled boolean false 禁用点击
custom-class string '' 根扩展 class

Events

事件 说明
click 点击步骤，参数为 index（number）；需 clickable

说明

  • 单步可显式 status，比仅靠 current 更适合失败 / 跳过场景。

隐私、权限声明

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

无

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

无

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

无

许可协议

MIT协议
评论列表 撰写评论 向官方投诉

暂无用户评论。