准时下班
准时下班
  • 发布:2022-11-10 19:00
  • 更新:2022-11-11 11:07
  • 阅读:258

【报Bug】关于focus加载页面无法将自动获取焦点

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: 21H1

HBuilderX类型: 正式

HBuilderX版本号: 3.4.7

手机系统: Android

手机系统版本号: Android 10

手机厂商: autoid

手机机型: q9

页面类型: vue

vue版本: vue2

打包方式: 云端

项目创建方式: HBuilderX

示例代码:

<template>
<view>
<view class="topBody">
<text class="bar_title">入库</text>
<image @click="goMyshelf" style="width: 30px; height: 30px; position: absolute; right: 10px; top: 32px;"
src="../../../static/main.png" mode="widthFix"></image>
</view>
<view class="classInput">
<text class="classInput_text">指示号</text>
<input class="classInput_input" :focus="isFocusGz" @blur="pointBlurGz" @confirm="searchGzNo" type="text" @input="gzNoInput" :value="gzNo" placeholder="指示号" />
<text class="classInput_input_text2" style="color: red;">箱数:{{countHks}}</text>
</view>
<view class="classInput">
<text class="classInput_text">发行号</text>
<input class="classInput_input" :focus="isFocusFx" @blur="pointBlurFx" @confirm="searchFxNo" type="text" @input="fxNoInput" :value="fxNo" placeholder="发行号" />
<text class="classInput_input_text2">{{wariGaiType == "S" ? "一贯" : wariGaiType == "" ? "" : "非一贯" }}</text>
</view>
<view class="classInput">
<text class="classInput_text">托盘号</text>
<input class="classInput_input" :focus="isFocusTp" @blur="pointBlurTp" type="text" @confirm="searchTpNo" @input="tpNoInput" :value="tpNo" placeholder="托盘号" />
<text class="classInput_input_text2">{{wariGaiMdl}}</text>
</view>
<view class="classInput">
<text class="classInput_text">管理号</text>
<input class="classInput_input" :focus="isFocusGl" @blur="pointBlurGl" type="text" @input="glNoInput" :value="glNo" placeholder="管理号" />
<text class="classInput_input_text2"></text>
</view>
<view class="classInput">
<button type="default" class="ubutton" @click="clickOk">确认</button>
<button type="default" class="ubutton" @click="clickSearch">查询</button>
<button type="default" class="ubutton" @click="clickReset">重置</button>
</view>
<view class="classInput">
<text class="utext">发行号数:{{issueCount}}</text><text class="utext">内装容器数:{{nzCount}}</text>
</view>
<view class="tableContent" :style="{'height': tableHeight +'!important'}">
<view class="tableTitle">
<label class="tableTitleLabelItem" style="background-color:#008577;">管理号</label>
<label class="tableTitleLabelItem" style="background-color:#008577;">托盘号</label>
<label class="tableTitleLabelItem" style="background-color:#008577;">发行号</label>
<label class="tableTitleLabelItem" style="background-color:#008577;">是否一贯</label>
<label class="tableTitleLabelItem" style="background-color:#008577;">内装容器</label>
<label class="tableTitleLabelItem" style="background-color:#008577;">入库状态</label>
</view>
<view v-for="item in list" class="tableConentView">
<label class="tableTitleLabelItem" :style="{'background-color': item['inFlag'] == '入库' ? '#6BCB77 !important' : '#FFD93D !important' }">{{item["Con_Mng_No"]}}</label>
<label class="tableTitleLabelItem" :style="{'background-color': item['inFlag'] == '入库' ? '#6BCB77 !important' : '#FFD93D !important' }">{{item["pac_no"]}}</label>
<label class="tableTitleLabelItem" :style="{'background-color': item['inFlag'] == '入库' ? '#6BCB77 !important' : '#FFD93D !important' }">{{item["issue_no"]}}</label>
<label class="tableTitleLabelItem" :style="{'background-color': item['inFlag'] == '入库' ? '#6BCB77 !important' : '#FFD93D !important' }">{{item["Wari_Gai_Type"]}}</label>
<label class="tableTitleLabelItem" :style="{'background-color': item['inFlag'] == '入库' ? '#6BCB77 !important' : '#FFD93D !important' }">{{item["koso_mdl"]}}</label>
<label class="tableTitleLabelItem" :style="{'background-color': item['inFlag'] == '入库' ? '#6BCB77 !important' : '#FFD93D !important' }">{{item["inFlag"]}}</label>
</view>
</view>
<view v-if="showKeyboard">
<keyboard-listener @keydown="keyboardClick($event)"></keyboard-listener>
</view>
</view>
</template>

<script>
import * as http from '@/common/http.js';
import keyboardListener from '@/components/keyboard-listener/keyboard-listener.vue';
import App from 'App';
export default {
data() {
return {
isFocusGz: true,
isFocusFx: false,
isFocusTp: false,
isFocusGl: false,
isCanSubmit: false,
gzNo:'',
fxNo:'',
tpNo:'',
glNo:'',
issueCount:'',
countHks: '',
wariGaiMdl:'',
wariGaiType:'',
nzCount:'',
list:[],
tableHeight: '300px',
isWariGaiMdl : false,
showKeyboard : true
}
},
onShow()
{
this.showKeyboard = true;
this.clickReset();
},
onHide()
{
this.showKeyboard = false;
},
onLoad()
{
let _this = this;
_this.isFocusGz=false
_this.$nextTick(function() {
_this.isFocusGz = true;
});
uni.getSystemInfo({
success:function(res){
_this.tableHeight = (res.windowHeight - 300) + 'px';
console.log(_this.tableHeight);
}
});
},
methods: {
keyboardClick(e)
{
if(e.keyCode == 13)
{
// this.clickOk();
}
},
pointBlurGz() {
this.isFocusGz = false;
},
pointBlurFx() {
this.isFocusFx = false;
},
pointBlurTp() {
this.isFocusTp = false;
},
pointBlurGl() {
this.isFocusGl = false;
},
gzNoInput(e) {
this.gzNo = e.detail.value;
},
fxNoInput(e) {
this.fxNo = e.detail.value;
},
tpNoInput(e)
{
this.tpNo = e.detail.value;
},
glNoInput(e)
{
this.glNo = e.detail.value;
},

操作步骤:

预期结果:

点击登录后光标选中focus为true的input框

实际结果:

第一次登录没有将focus为true的选中光标,切换tabbar菜单后光标又可以正常赋值

bug描述:

之前云打包focus设置为true的时候刚进页面可以将焦点自动选中第一个input框,但最近打包发现登录之后焦点无法自动选中input,在调试模式功能正常,但是打包成app之后就会出现这个问题,我将旧版本的app安装到扫描枪中打开app是可以获取到焦点,但是切换底部的tabbar后光标就可以正常的赋值给input

2022-11-10 19:00 负责人:DCloud_Android_ST 分享
已邀请:
DCloud_Android_ST

DCloud_Android_ST

请使用HX3.6.8版本 重新验证一下问题

  • 准时下班 (作者)

    我尝试一下

    2022-11-11 11:19

  • 准时下班 (作者)

    HI,我已经尝试过使用不同版本【3.4.7/3.6.4/3.6.8-Alpha】的HX打包,其中3.4.7正式版中出现了以下问题:

    1.通过登录后进入的第一个页面的data return中将focus的值赋值为true,则进入页面光标没有赋值到focus为true的input框中,需要手动点击其余input框之间的focus赋值正常。

    2.使用HX3.6.4打包apk则出现以下问题:场景一致登录后,进入页面光标正确赋值到focus为true的input框中,但使用AUTOID Q9 扫描枪、夜神模拟器、安卓手机输入值后回车光标都消失不见。【备注:回车之后成功会自动赋值下一个input的focus为true】

    3.使用HX3.6.8-Alpha版本打包则会出现扫描之后光标闪一下到第二个input框,然后又回到第一个input框并将第一个input框中的内容全选中

    2022-11-11 15:31

  • DCloud_Android_ST

    回复 准时下班: 提供demo 测试看下

    2022-11-11 16:24

  • 准时下班 (作者)

    回复 DCloud_Android_ST: 我将3.4.7版本与3.6.4打包apk与案例代码放在以下连接:https://vkceyugu.cdn.bspapp.com/VKCEYUGU-2d8392a2-0ff7-4553-b90c-99c9e5c6344c/48b695be-b704-4687-b9be-cf163ab13897.zip

    2022-11-11 17:28

  • DCloud_Android_ST

    回复 准时下班: 我这测试未复现 你测试设备是不是有什么特殊性

    2022-11-11 18:47

  • 准时下班 (作者)

    回复 DCloud_Android_ST: 我通过夜神模拟器对打包后的apk测试,输入值后回车应当切换,在调试模式【同一个模拟器 或手机】下该问题并没有出现,只出现在打包后;我已将测试过程录制成视频放在以下链接中:https://vkceyugu.cdn.bspapp.com/VKCEYUGU-2d8392a2-0ff7-4553-b90c-99c9e5c6344c/d6f56b2a-0f37-4f06-9954-02f9e3d28159.zip

    2022-11-12 15:10

  • 准时下班 (作者)

    回复 DCloud_Android_ST: 尝试使用3.6.4版本打包后使用手机的虚拟键盘回车不会触发这个问题,在模拟器或者扫描枪上出现这个问题

    2022-11-17 16:12

  • DCloud_Android_ST

    回复 准时下班: 提供下qq吧

    2022-11-17 16:52

  • 准时下班 (作者)

    回复 DCloud_Android_ST: 1347757229

    2022-11-17 17:12

该问题目前已经被锁定, 无法添加新回复