uni-app nvue页面下的input框在键盘手写模式下无法监听@input事件

uni-app nvue页面下的input框在键盘手写模式下无法监听@input事件

开发环境 版本号 项目创建方式
Windows window10 CLI
产品分类:uniapp/App

PC开发环境操作系统:Windows

手机系统:Android

手机系统版本号:Android 11

手机厂商:小米

手机机型:小米10s

页面类型:nvue

vue版本:vue2

打包方式:云端

CLI版本号:4.5.13

示例代码:

```javascript
<template>  
    <view>  
        <input [@input](/user/input)="handleInput(1)" @change="handleInput(1)"/>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  

            }  
        },  
        methods: {  
            handleInput(event){  
                console.log(event)  
            }  
        }  
    }  
</script>  

<style>  

</style>

操作步骤:

  1. 在nvue页面中使用input组件
  2. 切换到手写键盘输入

预期结果: 监听input事件,并在input组件中显示正在输入的文字

实际结果: 无法触发input事件以及change事件

bug描述:

  1. 在nvue页面中使用input组件
  2. 切换到手写输入模式
  3. 无法监听input事件(vue页面中表现正常,IOS平台表现正常) 项目使用的是vue和nvue混合开发的模式,但是这个页面是纯nvue页面

更多关于uni-app nvue页面下的input框在键盘手写模式下无法监听@input事件的实战教程也可以访问 https://www.itying.com/category-93-b0.html

7 回复

使用hx3.3.1版本 测试正常 未发现异常

更多关于uni-app nvue页面下的input框在键盘手写模式下无法监听@input事件的实战教程也可以访问 https://www.itying.com/category-93-b0.html


我使用的hbuilderX为3.2.16

回复 ddpapa: 你可以测试下3.3.1版本 看是否已修复

回复 DCloud_Android_ST: 3.3.1是Alpha版本,不会影响其他功能么

回复 ddpapa: 测试验证而已 不用出正式包

回复 DCloud_Android_ST: 我刚刚验证了一下,3.3.1alpha版本的确可以监听到手写键盘的input事件

这是一个已知的 nvue 平台特定问题,主要出现在 Android 设备的手写输入模式下。由于 nvue 使用原生渲染,其事件机制与 Vue 页面存在差异。

问题原因: Android 手写输入法在 nvue 的原生 input 组件中,输入事件传递路径与常规键盘不同,导致 @input@change 事件无法被正常触发。

临时解决方案:

  1. 使用 [@blur](/user/blur) 事件替代
    对于非实时性要求极高的场景,可监听失去焦点事件获取最终值:

    <input [@blur](/user/blur)="handleBlur" />
    
  2. 启用 confirm-type 并监听 [@confirm](/user/confirm)
    若输入场景允许,设置键盘确认按钮类型:

    <input confirm-type="done" [@confirm](/user/confirm)="handleConfirm" />
回到顶部