uniapp小程序自定义顶部导航栏,输入框软键盘把顶部顶上去的解决方法
首先在小程序input标签增加:adjust-position="false"的属性,然后已经可以把软键盘不使上方顶出,但是输入框也会因此被遮挡。this.inputHeight = e.detail.height //这个高度就是软键盘的高度。但是,这样就会出现键盘遮挡输入框的情况。解决后再附上解决方法。最后给所需要的输入框增加,动态绑定样式,问题就解决了。解决方法:在input输入框聚焦的方法
·
首先在小程序input标签增加:adjust-position="false"的属性,然后已经可以把软键盘不使上方顶出,但是输入框也会因此被遮挡
解决方法:在input输入框聚焦的方法中增加操作
@focus="inputBindFocus"
定义方法
inputBindFocus(e) { if (e.detail.height) { this.inputHeight = e.detail.height //这个高度就是软键盘的高度 } },
最后给所需要的div增加,动态绑定样式,问题就解决了
:style="{position: 'relative',bottom:inputHeight+'px'}"
图片:
补充:跳转页面,返回聊天页面后,底部聊天框会自己弹上去,我用uniapp页面监听传值不好使。之后用watch监听判断本地储存改变来进行高度改变
跳转页面的时候储存一个值,返回时进行判断,监听改变。
更多推荐
已为社区贡献2条内容
所有评论(0)