更新记录

0.3.0（2026-09-07） 下载此版本

  • 新增 right 插槽：搜索框最右侧自定义区（如相机/扫码入口），不受 showAction / animation 影响，可与搜索/清除按钮共存；插槽内点击事件由内容自行绑定

0.2.4（2026-09-01） 下载此版本

  • 修复 modelValue 被外部置 null 时崩溃（Cannot read property length of null，同 nax-input 0.2.6 修复）：useStorage 置 null 删除 key 等场景下 v-model 传入 null，innerValue 在初始化与 modelValue watch 双入口统一规整为空串；外部置 null 显示为空串，其它行为不变

0.2.3（2026-08-19） 下载此版本

  • 修复蒸汽模式（App Android / iOS / HarmonyOS）输入文字显示为白色不可见：原生 input 默认文字色改为字面量内联样式，并通过 custom-class 支持暗色主题；Web / 微信小程序行为保持不变
查看更多

平台兼容性

uni-app x(4.25)

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

其他

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

nax-search

uni-app x 搜索框，功能覆盖常用搜索场景。

依赖

  • nax-icon（搜索 / 清除图标）
  • nax-ui-theme（CSS 变量 --nax-*，安装时依赖 / 运行时弱依赖）

基础用法

<nax-search v-model="keyword" @search="onSearch" @custom="onCustom"></nax-search>

形状 shape

值 说明
round 胶囊圆角（默认）
square 方角（radius-md）

常用 Props

属性 类型 默认 说明
modelValue string '' v-model 值
shape string round round / square
background string '' 输入区背景；空则 --nax-color-bg-hover
bg-color string '' 兼容别名；与 background 二选一，background 优先
placeholder string 请输入关键字 占位
clearable boolean true 有内容时显示清除
show-action boolean true 显示右侧操作按钮
action-text string 搜索 右侧按钮文案
action-color string '' 右侧按钮文字色
animation boolean false 为 true 时右侧按钮仅聚焦显示
input-align string left left / center / right
disabled boolean false 禁用；禁用时点击根节点触发 click
border-color string '' 有值时显示边框
search-icon string search 左侧图标名；空字符串隐藏
search-icon-color string '' 图标色
search-icon-size string '' 图标尺寸，数字按 px
color string '' 输入文字色
placeholder-color string '' 占位色
maxlength number -1 最大长度；-1 不限制
height string '' 覆盖高度（数字按 px）
label string '' 左侧文案
size string md sm / md / lg
focus boolean false 自动聚焦
adjust-position boolean true 键盘上推页面
custom-class string '' 根节点扩展 class

事件

事件 说明
update:modelValue v-model
input 输入变化（当前值），输入过程中每次触发
change 失焦时内容与聚焦时不同才触发（当前值），对齐原生 input 语义
search 键盘搜索/完成（当前值）
custom 点击右侧操作（当前值）
focus / blur 聚焦 / 失焦（当前值）
clear 点击清除
click 仅 disabled 时点击根节点
clickIcon 点击搜索图标

插槽

名称 说明
label 自定义左侧 label
action 自定义右侧操作区
right 最右侧自定义内容（如相机/扫码图标），点击事件在插槽内容上自行绑定

主题

通过 CSS 变量覆盖：

Token 用途
--nax-border-width 边框粗细
--nax-color-bg-hover 按压/悬停背景色
--nax-color-text 主文字色
--nax-color-text-disabled 禁用文字色
--nax-opacity-disabled 禁用透明度

平台说明

  • 基于原生 input + confirm-type=search。
  • 清除按钮：有内容即显示（不依赖 focus）。

隐私、权限声明

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

无

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

无

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

无

许可协议

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

暂无用户评论。