更新记录

1.1.2（2026-04-25） 下载此版本

修改已知bug

1.1.1（2026-04-25） 下载此版本

修改已知bug

1.0.4（2026-04-25） 下载此版本

1.解决插件市场下载的HBUILDX导入事例项目不可用的问题。 2.修改说明书

平台兼容性

uni-app(4.0)

其他

iorange-nvwaAsrInput

女娲语音输入组件

🚀 最好用的web端语音输入组件

核心特性：

• 🎯 中英文混合输入 - 无需切换，自动识别
• ⏸️ 自动检测停顿 - 智能断句，边说边生成
• 📍 插入位置追踪 - 灵活插入语音文字到任意位置
• 📏 自动调整高度 - 输入框自适应内容

亮点功能：

• ✨ 语音输入超便捷，想说什么就说什么
• 🌐 中英文随心说，不用切换不用翻译，mixed language 一秒识别
• 📝 想插入什么位置就从什么位置开始插入

平台支持： H5及微信小程序平台完美运行，其他平台正在开发中

组件列表

• NvwaAsrInput - 组合组件，集成语音输入和自动调整高度的文本框

平台兼容性

安装方式

将 iorange-nvwaAsrInput 目录放置在项目的 uni_modules 目录下即可。

使用方法

iorange-nvwaAsrInput 组件

<template>
  <iorange-nvwaAsrInput
    v-model="userInput"
    placeholder="请输入内容或使用语音输入..."
    :show-send-btn="true"
    :min-height="1"
    :max-height="5"
    @send="handleSend"
    @speaking="handleSpeaking"
    @focus="handleFocus"
    @blur="handleBlur"
    @cursor-change="handleCursorChange"
  />
</template>

<script setup>
import { ref } from 'vue'

const userInput = ref('')

function handleSend(content) {
  console.log('发送内容:', content)
}

function handleSpeaking(speaking) {
  console.log('说话状态:', speaking)
}

function handleFocus(event) {
  console.log('获得焦点:', event)
}

function handleBlur(event) {
  console.log('失去焦点:', event)
}

function handleCursorChange(position) {
  console.log('光标位置:', position)
}
</script>

Props

NvwaAsrInput Props

Events

NvwaAsrInput Events

使用说明

1. 点击麦克风图标开始语音输入
2. 说话时会自动识别并显示在输入框中
3. 也可以直接在输入框中输入文字
4. 点击插入位置继续说自动插入到对应位置
5. 点击发送按钮提交内容

注意事项

1. 本组件仅支持 H5 及 微信小程序 平台，依赖于 Web Audio API 和 WebSocket。
2. 使用语音输入功能需要确保服务端 WebSocket 服务正常运行。
3. 需要在 HTTPS 环境或 localhost 下使用麦克风权限。
4. 开发环境下组件默认使用通用SDK，只能在localhost(本地)测试使用。
5. 生产环境请获取自己的专属免费SDK，登录https://asr.nvwaai.online获取。如下图：
6. 微信小程序需要在微信开发者平台配置websocket服务器域名：wss://asr.nvwaai.online。如下图：
7. 微信小程序需要真机测试，不能在微信开发者工具中测试（因为获取不到真实的语音数据）。
8. 微信小程序调试时不允许游客模式读取麦克风数据，所以需要获取自己专属的免费SDK，登录https://asr.nvwaai.online获取。如下图：

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

无

更新日志

v1.0.0

• 初始版本
• 支持语音识别输入
• 支持自动调整高度
• 支持光标位置追踪