第一步:需要在page.json中配置 "softinputMode": "adjustResize", //手机软键盘升起不让其将页面头部上推 如果所有页面都有键盘弹起的功能,可直接在 appPlus中配置,如果不是,直接在哪个页面需要配置哪个即可(建议),在appPlus中配置 "softinputMode": "adjustResize"后,有的页面没有键盘弹起的功能,会导致该页面不能滚动
附 softinputMode 每个属性值的含义
第二步:配置后,需要在顶部导航栏的位置添加固定定位.
.topsdingwei{
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 9999999999; // 层级调整到最高
}
第三步:添加固定定位后,会导致该元素脱标,下面的元素往上顶。 在顶部导航栏dom元素的同级 再添加一个dom元素 添加的dom元素的高和顶部导航栏的高保持一致即可
<view>
<view class="topsdingwei">
</view>
<view :style="{'height':hearHeight+'px'}">
</view>
</view>
uniapp中获取dom元素的方法
const query = uni.createSelectorQuery().select('.topsdingwei')
query.boundingClientRect(data => {
console.log('data', JSON.stringify(data))
let height = data.height //data.height就是该元素的高度
}).exec();