pages.json 必须为具体页面配置 softinputmode: "adjustresize",否则安卓端 uni.onkeyboardheightchange 不触发;ios 需防抖、动态获取导航栏高度并设同高占位元素,textarea 需加 adjust-position="true" 和 cursor-spacing="120"。

pages.json 必须配 softinputMode: "adjustResize"
不配这句,安卓端 uni.onKeyboardHeightChange 根本不会触发——不是监听没写对,是原生层压根不发事件。iOS 虽能进回调,但部分老机型支持不稳定,必须兜底。
adjustResize 让 WebView 视图高度真实收缩,触发布局重排;而默认的 adjustPan 只是平移整个窗体,会导致固定定位的导航栏被硬生生顶上去。
- 必须写在具体页面的
style下,不能只塞进全局app-plus配置,否则无键盘需求的页面(如地图页)可能失去滚动能力 - 如果页面用了
scroll-view或自定义滚动容器,它可能拦截 resize 行为,导致上推失效 - 配置后需配合固定定位 + 占位元素,否则内容会直接顶穿导航栏
导航栏要 position: fixed 且加同高占位
仅设 position: fixed 不够:元素脱标后,下面的内容会往上顶,把导航栏“撑空”。必须在它同级插入一个等高占位 view,维持文档流高度。
- 用
uni.createSelectorQuery().select('.nav-header')动态获取导航栏真实高度,避免写死像素值 - 占位元素的
height必须和导航栏一致,否则页面滚动时会出现空白或重叠 -
z-index建议设为999起,确保不被键盘或弹层遮挡
textarea 必须带 adjust-position="true" 和 cursor-spacing="120"
这两个属性只对原生 textarea 生效,第三方封装组件(如 u-input)往往不透传,容易踩坑。
-
adjust-position="true"是自动上推的开关,不写等于关掉引擎 -
cursor-spacing设太小(如20)推不动,太大(如300)会空出大片空白,80–120是实测较稳区间 - iOS 上
adjust-position对position: fixed父容器效果打折,此时得靠uni.pageScrollTo补位
监听键盘高度时必须防抖 + 清理监听器
uni.onKeyboardHeightChange 在 iOS 上常有抖动:先报 height: 0,再报 268,甚至反复跳变。直接响应会导致导航栏闪动或错位。
- 只接受
res.height > 50的值,过滤误报 - 用
setTimeout延迟 200–300ms 更新状态,等视口稳定后再计算 - 监听必须在
onFocus里注册、onBlur里调用uni.offKeyboardHeightChange清理,否则多次进出页面会叠加监听器 - H5 端不触发该事件,需另走
window.addEventListener('resize')+ 高度差判断
44px,结果 iOS 状态栏变化、刘海屏适配或字体缩放都会让高度失准,最终导航栏仍会被顶起。











