【uniapp】 软键盘弹出后fixed定位被顶上去问题

问题描述

当手机设计的导航栏为fixed定位上去时,输入框获取焦点就会把顶部自定义的导航栏顶到上面去,如下图所示

解决办法

输入框设置 :adjust-position="false"

复制代码
<input type="text"  :adjust-position="false" @focus="inputBindFocus" @blur="outBindFocus"/>

当输入框获取焦点时获取到软键盘的高度,方法为inputBindFocus

复制代码
inputBindFocus(e) {
if (e.detail.height) {
	   this.fixTop = e.detail.height //这个高度就是软键盘的高度
  }
 },

失去焦点时的 方法

复制代码
outBindFocus() {
				this.fixTop = 0;
			},

然后把fiexTop给弹窗的最外层加上padding就好了

复制代码
<view class="popCon" :style="'padding-bottom:'+fixTop+'px'">

亲测有效,哈哈,但是有一点延迟,不知道大佬有没有好的解决办法,欢迎评论

相关推荐
jerrywus2 分钟前
让 AI 帮你部署 Vercel,报错了也不用手动搬日志
前端·agent·mcp
补码缩写8 分钟前
11 行 Python 拆 PNG 块,解压后的字节数能手算
前端
coding漫漫长路11 分钟前
PNG压缩先看图是哪一类,先无损再量化多半白做
前端
用户2576807632111 分钟前
搜「洗牙」为什么搜不到「洁治」
前端
费曼学习法18 分钟前
Agent 死循环的根因不在模型:错误分类、退避、熔断、快照四层实现
前端
修炼的dance18 分钟前
同一张PNG换五种压法,体积差在颜色数上
前端
Lank_M20 分钟前
PNG 有损压缩省下的体积,大头不在 deflate
前端
用户老李42 分钟前
相机模型与标定自学教程 02:外参 \[R | t] 与完整投影链路
前端
Dream-Y.ocean1 小时前
鸿蒙PC平台逻控 PLC 编辑器适配实战:基于 Electron 壳方案的纯 JavaScript 梯形图编程与仿真引擎开发
javascript·编辑器·harmonyos
用户老李1 小时前
无线电自学教程 03:电路基础——从欧姆定律到 LC 谐振
前端