uni-app 3.0.7之后版本 subNvue使用Input键盘顶起页面不再下降

uni-app 3.0.7之后版本 subNvue使用Input键盘顶起页面不再下降

1 回复

更多关于uni-app 3.0.7之后版本 subNvue使用Input键盘顶起页面不再下降的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在uni-app 3.0.7及以上版本中,subNvue使用Input组件时键盘顶起页面后不再自动下降的问题,通常与页面布局或焦点管理有关。以下是几种常见解决方案:

  1. 检查页面结构:确保subNvue窗口未使用position: fixed,否则可能影响键盘收起时的页面回弹。建议改用flex布局,并设置pages.jsonstylesoftInputModeadjustResize

  2. 手动控制焦点:在Input失焦时(如点击其他区域)调用blur()方法强制收起键盘。示例:

    // 在subNvue页面的methods中
    handleBlur() {
      this.$refs.input.blur();
    }
    
  3. 监听键盘事件:通过uni.onKeyboardHeightChange监听键盘高度变化,在高度为0时主动调整页面位置:

    uni.onKeyboardHeightChange(res => {
      if (res.height === 0) {
        // 触发页面回滚逻辑,例如重置scroll-top
      }
    });
回到顶部