【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'">

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

相关推荐
大龄秃头程序员8 分钟前
iOS Method Swizzling 的工程化实践:如何处理多重交换与第三方冲突
前端
liangshanbo121512 分钟前
Webpack 文件指纹面试题整理
前端·webpack·node.js
xieter21 分钟前
【技术精选】Node.js 核心事件循环机制与异步 I/O 深度剖析 (2026-10-02)
前端·javascript
计算机魔术师1 小时前
Ethan Mollick 谈点与群:智能体自组织为何让管理假设失效
前端
想吃火锅10051 小时前
【leetcode】238.除了自身以外数组的乘积js
javascript·算法·leetcode
故七月2 小时前
GEO 信源评估体系:如何判断一条网页信源能否被大模型采信
前端·网络·人工智能
liangshanbo12152 小时前
Webpack 常见 Plugin 面试题
前端·webpack·node.js
xxwl5852 小时前
vue3的入门学习
前端·vue.js·学习
用户847172102842 小时前
.shot 文件格式规范
前端·后端
web打印社区2 小时前
政务办事大厅:叫号小票、办理回执网页怎么静默出纸
前端·javascript·vue.js·pdf·html·政务