uni-app input @blur真机调试出错 [object DOMException] at view.umd.min.js:1

uni-app input @blur真机调试出错 [object DOMException] at view.umd.min.js:1

类别 信息
产品分类 uniapp/App
PC开发环境 Windows
PC版本号 windows8
HBuilderX类型 正式
HBuilderX版本 3.1.11
手机系统 Android
手机版本号 Android 6.0
手机厂商 小米
手机机型 红米
页面类型 vue
打包方式 云端
项目创建方式 HBuilderX

示例代码：

<view class="uni-form-item uni-column">  
    <view class="title">数字输入的 input</view>  
    <input class="uni-input" type="number" placeholder="这是一个数字输入框" [@blur](/user/blur)="onBlur" />  
</view>

onBlur() {  
    console.log('blur=true');  
}

操作步骤：

预期结果：

实际结果：

  • [object DOMException] at view.umd.min.js:1

bug描述： <input @blur=“onBlur” /> 无法触发blur事件


更多关于uni-app input @blur真机调试出错 [object DOMException] at view.umd.min.js:1的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

解决了吗

更多关于uni-app input @blur真机调试出错 [object DOMException] at view.umd.min.js:1的实战教程也可以访问 https://www.itying.com/category-93-b0.html


我恢复了版本也没有

现在是 2023年，我。。。

这是一个典型的 uni-app 中 input 组件 blur 事件在 Android 真机上的兼容性问题。从错误信息 [object DOMException] 和截图来看，问题出现在 view.umd.min.js:1，这通常与底层渲染引擎有关。

问题分析： 在 Android 6.0 这样的较低版本系统中，WebView 内核可能对 blur 事件处理存在兼容性问题。特别是当 input 类型为 number 时，某些系统版本在失去焦点时可能无法正确触发 blur 事件。

解决方案：

  1. 使用 @confirm 替代 对于数字输入框，可以使用键盘的完成按钮触发事件：

    <input class="uni-input" type="number" placeholder="这是一个数字输入框" [@confirm](/user/confirm)="onBlur" />

  2. 改用 @input + 防抖 如果需要实时验证，可以结合 input 事件：

    let timer = null
onInput(e) {
  clearTimeout(timer)
  timer = setTimeout(() => {
    this.onBlur(e)
  }, 500)
}

  3. 切换输入框类型 尝试将 type="number" 改为 type="digit" 或 type="text" 测试兼容性。

  4. 检查焦点管理 确保页面中没有其他元素干扰焦点获取，可以尝试手动触发 blur：

    onBlur() {
  this.$nextTick(() => {
    uni.hideKeyboard()
  })
}
回到顶部