uni-app 新安装的应用两次热更新后输入框聚焦页面不会上推

发布于 1周前 作者 gougou168 来自 Uni-App

uni-app 新安装的应用两次热更新后输入框聚焦页面不会上推

信息类别 信息内容
产品分类 uniapp/App
PC开发环境 Windows
PC版本号 win11
HBuilderX 正式
HBuilderX版本 3.8.3
手机系统 Android
手机版本号 Android 13
手机厂商 vivo
手机机型 一加8T, Vivo S9e 等好几个型号的手机都这样
页面类型 vue
vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX

操作步骤:

  • 全量打包一个应用,然后热更新两次补丁

预期结果:

  • 输入框聚焦页面应该上推防止挡住输入框

实际结果:

  • 新安装的应用,两次热更新后输入框聚焦页面不会上推

bug描述:

新安装的应用,两次热更新后输入框聚焦页面不会上推,刚安装或者刚安装第一次热更新正常,第二次热更新后就会出现输入框聚焦页面不能上推的问题。pages.json配置

"app-plus": {  
    "softinputMode": "adjustResize"  
}

软键盘弹出时,webview窗体高度也不会挤压。


2 回复

请上传一个能重现问题的测试工程。


在 uni-app 中,如果遇到新安装的应用在两次热更新后,输入框聚焦时页面不会上推的问题,可能是由于以下原因导致的:

1. 页面布局问题

  • 原因:页面的布局可能存在问题,导致输入框聚焦时,页面无法正确上推。
  • 解决方案:检查页面的布局,确保输入框所在的容器有足够的空间,并且页面的 scroll-viewpage 容器设置正确。

2. 键盘弹出模式问题

  • 原因:在某些情况下,键盘的弹出模式可能会导致页面不上推。
  • 解决方案:可以尝试在 pages.json 中配置页面的 softinputMode 属性,设置为 adjustResizeadjustPan,以调整键盘弹出时的页面行为。
{
  "pages": [
    {
      "path": "pages/index/index",
      "style": {
        "softinputMode": "adjustResize"
      }
    }
  ]
}

3. 热更新导致的缓存问题

  • 原因:热更新可能会导致某些缓存数据或配置未正确更新,从而影响页面的行为。
  • 解决方案:尝试清除应用的缓存,或者重新安装应用,看看问题是否依然存在。

4. uni-app 版本问题

  • 原因:使用的 uni-app 版本可能存在已知的 bug,导致输入框聚焦时页面不上推。
  • 解决方案:检查 uni-app 的版本,尝试升级到最新版本,或者查看官方文档和社区,看看是否有相关的 bug 修复。

5. 自定义组件或插件冲突

  • 原因:如果使用了自定义组件或第三方插件,可能会导致与 uni-app 的默认行为冲突。
  • 解决方案:检查是否有使用自定义组件或插件,尝试禁用它们,看看问题是否依然存在。

6. 系统或设备问题

  • 原因:某些设备或系统版本可能存在兼容性问题,导致输入框聚焦时页面不上推。
  • 解决方案:在不同的设备或系统版本上测试,看看问题是否普遍存在。

7. 代码逻辑问题

  • 原因:代码中可能存在某些逻辑错误,导致输入框聚焦时页面不上推。
  • 解决方案:检查代码逻辑,确保没有在输入框聚焦时阻止页面滚动或上推。

8. 使用 scroll-into-view

  • 解决方案:如果输入框在页面底部,可以尝试使用 scroll-into-view 属性,手动将输入框滚动到可视区域。
<scroll-view scroll-y="true" :scroll-into-view="scrollIntoViewId">
  <input @focus="handleFocus" />
</scroll-view>
export default {
  data() {
    return {
      scrollIntoViewId: ''
    };
  },
  methods: {
    handleFocus() {
      this.scrollIntoViewId = 'inputId';
    }
  }
};
回到顶部
AI 助手
你好,我是IT营的 AI 助手
您可以尝试点击下方的快捷入口开启体验!