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

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

相关推荐
my一阁4 分钟前
tomcat web实测
java·前端·nginx·tomcat·负载均衡
huangql52010 分钟前
前端多版本零404部署实践:为什么会404,以及怎么彻底解决
前端
梵得儿SHI31 分钟前
Vue 数据绑定深入浅出:从 v-bind 到 v-model 的实战指南
前端·javascript·vue.js·双向绑定·vue 数据绑定机制·单向绑定·v-bind v-model
Moment33 分钟前
Electron 发布 39 版本 ,这更新速度也变态了吧❓︎❓︎❓︎
前端·javascript·node.js
消失的旧时光-194334 分钟前
8方向控制圆盘View
android·前端
自由日记38 分钟前
前端学习:选择器的类别
前端·javascript·学习
念念不忘 必有回响38 分钟前
Nginx前端配置与服务器部署详解
服务器·前端·nginx
江城开朗的豌豆39 分钟前
Webpack打包:从“庞然大物”到“精致小可爱”
前端·javascript
安当加密39 分钟前
基于ASP身份认证网关实现Web系统免代码改造的单点登录方案
java·开发语言·前端