小程序中，fixed在底部的view，在弹出输入法键盘后如何保持可见？ - WXOPEN Club

需求的场景描述（希望解决的问题）

fixed在bottom的view，页面中有textarea，当焦点到textarea上面时，弹出输入法后，bottom的view会被输入法挡住

.bar {

position: fixed;

width: 100%;

bottom: 0;

display: flex;

justify-content: space-between;

align-items: flex-end;

padding: 5rpx 10rpx 5rpx 10rpx;

color: #555;

background-color: ghostwhite;

z-index: -1;

}

希望提供的能力

如何设置bottom的view，在弹出输入法时仍然保持在底部？

2 回复

xujuan1 楼6 年前

你好。请问有解决方案了吗。谢谢

juandeng2 楼5 年前

1：可以设置cursor-spacing 的属性距离

2：使用bindfocus、bindblur 操作函数来动态设置底部组件框与底部之间的距离（外边距）：margin-bottom:30rpx;

js data里面设置一个变量：inputMarBot: false, //评论框聚焦时，让评论框距离底部的距离为30rpx

wxml 页面：使用三元表示设置style input组件的父元素容器与底部外边距：<view class='' style="{{inputMarBot?'margin-bottom:50rpx':''}}">（关键，主要跟input的聚焦和是去焦点有关）及input组件定义属性：bindfocus='settingMbShow' bindblur='settingMbNoShow'