- 需求的场景描述(希望解决的问题)
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 : 5 rpx 10 rpx 5 rpx 10 rpx; color : #555 ; background-color : ghostwhite; z-index : -1 ; } |
- 希望提供的能力
如何设置bottom的view,在弹出输入法时仍然保持在底部?
你好。请问有解决方案了吗。谢谢
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'
兄弟,fixed底部的view中并没有input,只有两个按钮