PDA扫码后发起网络请求,清空输入框,并将焦点重新聚焦。偶现输入框无法清空、焦点聚焦失败。已证实是uni-app的hbuilder更新的问题,3.5.3版本打出来的包是正常的,往上全部都有这个问题。

PDA扫码后发起网络请求,清空输入框,并将焦点重新聚焦。偶现输入框无法清空、焦点聚焦失败。已证实是uni-app的hbuilder更新的问题,3.5.3版本打出来的包是正常的,往上全部都有这个问题。

示例代码:

<u-input  v-model="paramsData.codeAndName" :placeholder="$t('common1.scan'||'请扫描')" :border="true"  
                    @confirm="search($event)" :focus="firstFocus"></u-input>  

//这部分是函数:  

            search(e) {  
                this.$http.get({  
                    url: `/...`,  
                }).then(res => {  
                                     ...  
                }).catch(err => {  
                }).finally(() => {  
                                         //清空输入框  
                    this.paramsData.codeAndName = ''  
                                        //重新聚焦到输入框  
                    this.firstFocus = false  
                    this.$nextTick(() => {  
                        this.firstFocus = true  
                    })  
                })  
            }

操作步骤:

如上代码,在PDA上扫描复现。在H5端和手机上无法扫描,因此无法复现。

预期结果:

扫描多次,输入框始终可以聚焦。

实际结果:

扫描多次后,输入框就失去焦点。

bug描述:

PDA扫码,扫码结束后调用事件,清空输入框,并将焦点重新聚焦到输入框。偶现输入框无法清空、焦点无法重新聚焦。有时候扫描七八次会出现焦点未回到输入框的情况,有时候扫描十几次会出现。已证实是hbuilder更新的问题,3.5.3版本打出来的包是正常的,往上的版本全部都有这个问题。 目前使用Uniapp开发PDA的人特别多,希望官方可以重视这个问题,另外可以看一下这个链接下面的反馈,我猜测是相同的原因导致的这个问题。官方说已修复,但是评论区的反馈都说未修复。谢谢。 链接:https://ask.dcloud.net.cn/question/153554


### 表格

| 信息类别       | 信息内容               |
|----------------|------------------------|
| 产品分类       | uniapp/App             |
| PC开发环境     | Windows                |
| PC开发环境版本 | window11               |
| 开发工具       | HBuilderX              |
| 工具版本       | 3.8.12                 |
| 手机系统       | Android                |
| 手机系统版本   | Android 6.0            |
| 手机厂商       | 华为                   |
| 手机机型       | PDA                    |
| 页面类型       | vue                    |
| vue版本        | vue2                   |
| 打包方式       | 离线                   |
| 项目创建方式   | HBuilderX              |

更多关于PDA扫码后发起网络请求,清空输入框,并将焦点重新聚焦。偶现输入框无法清空、焦点聚焦失败。已证实是uni-app的hbuilder更新的问题,3.5.3版本打出来的包是正常的,往上全部都有这个问题。的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于PDA扫码后发起网络请求,清空输入框,并将焦点重新聚焦。偶现输入框无法清空、焦点聚焦失败。已证实是uni-app的hbuilder更新的问题,3.5.3版本打出来的包是正常的,往上全部都有这个问题。的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这个问题确实是HBuilderX更新后引入的已知bug,主要出现在Android平台的PDA设备上。从3.5.3之后的版本都存在输入框清空和焦点控制失效的问题。

根据问题描述和代码分析,建议尝试以下临时解决方案:

  1. 使用setTimeout包裹焦点控制逻辑:
this.paramsData.codeAndName = ''
setTimeout(() => {
    this.firstFocus = false
    this.$nextTick(() => {
        this.firstFocus = true
    })
}, 100)
  1. 或者改用原生DOM操作强制聚焦:
this.paramsData.codeAndName = ''
this.$nextTick(() => {
    const input = this.$refs.inputRef?.$el?.querySelector('input')
    input?.focus()
})
回到顶部