聊天uniapp 微信小程序以及安卓app键盘弹出会把底部fixed定位的textarea输入框覆盖掉的解决方法

通过在pages.json中配置softinputMode:adjustResize,并设置最外层页面高度为100vh,可以优化聊天应用的显示。然而,若底部仍被遮挡,可将内部view高度设为95vh以避免此问题。
摘要由CSDN通过智能技术生成

采用此方法解决

1.设置pages.json文件

将pages.json文件在指定的页面中加入以下配置 “softinputMode”: “adjustResize”

{
    "path" : "pages/message/Chat",
        "style": {
        "app-plus": {
            "softinputMode": "adjustResize"
        }
    }
}

2.设置最外层页面高度应为 100vh

具体代码如下,将container的高度设置为100vh

<template>
    <view class="container">
        内容代码区域.......
    </view>
</template>
.container {
    height: 100vh;
}

注意:

虽然加了100vh后,但是聊天窗口底部还是会被遮挡,这怎么办那?办法就是:把内框view设置成95vh,小于100vh就行。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值