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

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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/61168.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Ubuntu18.04使用carla0.9.5联合仿真搭环境报错

Ubuntu18.04使用工程与carla0.9.5联合仿真报错 1 File "/home/cg/Auto_driving/src/ros-bridge/carla_ros_bridge/src/carla_ros_bridge/client.py", line 18, in <module>from carla_ros_bridge.bridge_with_rosbag import CarlaRosBridgeWithBagFile "…

实例035 动画形式的程序界面

实例说明 在很多的程序界面中&#xff0c;都是以菜单或工具栏的形式显示窗体界面&#xff0c;这种显示方式是以静止状态显示的&#xff0c;界面不够生动。下面介绍一个以动画显示窗体界面的设计方法。运行本例&#xff0c;效果如图1.35所示。 技术要点 在该实例中用到了Micr…

SketchUp Pro 2023 for Mac(草图大师)

SketchUp Pro 2023 for Mac提供了简单易学的用户界面和强大的工具集&#xff0c;使用户可以快速创建复杂的3D模型。其中包括智能绘图工具、自动生成几何体、高级纹理编辑器、实时阴影、交互式地形建模工具等功能。 一、创建形象化您的想法 手工绘制的乐趣。超级智能的3D建模软…

[足式机器人]Part4 机械设计 Ch00/01 绪论+机器结构组成与连接 ——【课程笔记】

本文仅供学习使用 本文参考&#xff1a; 《机械设计》 王德伦 马雅丽课件与日常作业可登录网址 http://edu.bell-lab.com/manage/#/login&#xff0c;选择观摩登录&#xff0c;查看2023机械设计2。 机械设计-Ch00Ch01——绪论机器结构组成与连接 Ch00-绪论0.1 何为机械设计——…

云渲染:物理机房vs服务器机房,哪个更省时省力?

在3D渲染行业&#xff0c;传统的物理机和新兴的云服务器成为了企业在大规模渲染时面临的难题。物理机房和云服务器机房&#xff0c;究竟哪个渲染起来更省时省力呢&#xff1f;想知道就看下去吧&#xff01; 1.物理机房 物理机是传统的服务器形式&#xff0c;是一种独立的硬件设…

SpringBoot 依赖管理

Spring Boot 依赖管理 在 Spring Boot 中&#xff0c;依赖管理是通过 Maven 或 Gradle 进行管理的。Spring Boot 提供了一种简化的方式来管理和引入依赖项&#xff0c;使得构建和管理项目变得更加容易。下面是一些关于 Spring Boot 依赖管理的基本信息和示例&#xff1a; 使用…

linux remoteproc驱动中elf解析函数实现分析

linux remoteproc驱动中elf解析函数实现分析 1 ELF文件组织结构2 ELF_GEN_FIELD_GET_SET3 elf 各种header解析接口以及其实现3.1 elf header3.1.1 elf header解析接口3.1.2 elf header各个解析函数为&#xff1a;3.1.2.1 ELF_GEN_FIELD_GET_SET(hdr, e_entry, u64)3.1.2.2 ELF_…

LVS集群

目录 1、lvs简介&#xff1a; 2、lvs架构图&#xff1a; 3、 lvs的工作模式&#xff1a; 1&#xff09; VS/NAT&#xff1a; 即&#xff08;Virtual Server via Network Address Translation&#xff09; 2&#xff09;VS/TUN &#xff1a;即&#xff08;Virtual Server v…

LeetCode 热题 100 JavaScript--141. 环形链表

给你一个链表的头节点 head &#xff0c;判断链表中是否有环。 如果链表中有某个节点&#xff0c;可以通过连续跟踪 next 指针再次到达&#xff0c;则链表中存在环。 为了表示给定链表中的环&#xff0c;评测系统内部使用整数 pos 来表示链表尾连接到链表中的位置&#xff08;…

openGauss学习笔记-36 openGauss 高级数据管理-TRUNCATE TABLE语句

文章目录 openGauss学习笔记-36 openGauss 高级数据管理-TRUNCATE TABLE语句36.1 语法格式36.2 参数说明36.3 示例 openGauss学习笔记-36 openGauss 高级数据管理-TRUNCATE TABLE语句 清理表数据&#xff0c;TRUNCATE TABLE用于删除表的数据&#xff0c;但不删除表结构。也可以…

wonderful-sql 作业

Sql 作业 作业1&#xff1a; 答&#xff1a; create table Employee (Id integer not null, Name varchar(32) , Salary integer, departmentId integer, primary key (Id) );create table Department( Id integer primary key, Name varchar(30) not null );insert into emp…

STM32基于CubeIDE和HAL库 基础入门学习笔记:物联网项目开发流程和思路

文章目录&#xff1a; 第一部分&#xff1a;项目开始前的计划与准备 1.项目策划和开发规范 1.1 项目要求文档 1.2 技术实现文档 1.3 开发规范 2.创建项目工程与日志 第二部分&#xff1a;调通硬件电路与驱动程序 第三部分&#xff1a;编写最基础的应用程序 第四部分&…