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

这篇具有很好参考价值的文章主要介绍了聊天uniapp 微信小程序以及安卓app键盘弹出会把底部fixed定位的textarea输入框覆盖掉的解决方法。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

采用此方法解决

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就行。文章来源地址https://www.toymoban.com/news/detail-742715.html

到了这里,关于聊天uniapp 微信小程序以及安卓app键盘弹出会把底部fixed定位的textarea输入框覆盖掉的解决方法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uniapp的打包:h5、微信小程序以及APP方式

    本人用的是HBuilder编译器,学习uniapp时b站某位大大推荐的,我刚开始接触代码时候也用过,那时候并不好用这个编译器,但是现在试了一下挺好用的。 这是h5页面的打包配置,新版本的HBuilder用的是web配置(也就是h5配置的意思) 由于上图是我个人项目练习,没有用到appID,所

    2024年02月09日
    浏览(36)
  • 【uniapp】微信小程序分享到聊天,朋友圈

    ​​​​​manifest.json的app模块配置开启Share微信分享,填入appId。  2.示例  3.界面分享按钮:button open-type=\\\"share\\\"分享/button

    2024年02月14日
    浏览(36)
  • uniapp微信小程序 选择聊天记录文件上传

    目录 精简版总结 示例 容易踩的坑 1、页面刷新问题 2、extension问题 单文件 多个文件 PS:files和filePath/name只能二选一组 此处用xlsx文件作实例,选择聊天记录中的xlsx文件上传到指定接口中。 因为某些微信版本extension可能不生效,或者又想要对提交的文件名做校验,建议参考我

    2024年02月09日
    浏览(27)
  • uniapp 打包H5,打包小程序,打包app分享到微信聊天、朋友圈

    1.uniapp打包H5操作手法:Hbuilder-发行-网站-PC-WEB端或手机端H5访问,需要填写个访问域名,即发布后访问的域名路径 2.uniapp打包H5配置注意事项:uniapp下manifest.json文件中H5配置相关配置,路由模式选择hash,勾选上https访问。 注:如果是本地访问没有https设置,则该项不要勾选,打

    2024年02月09日
    浏览(35)
  • uniapp项目打包(安卓apk和微信小程序)

    uniapp的打包方式有很多,这里主要讲解App打包成安卓apk和微信小程序的两种方式 原生App分为云打包和本地打包两种,一般只推荐使用云打包来快速打包成安卓apk 安卓正式包 勾选使用云端证书时,我们无需手动生成证书别名、证书私钥密码、证书文件等,uniapp官方已配置好云

    2024年02月03日
    浏览(36)
  • 基于安卓的考研助手系统app 微信小程序

    ,设计并开发实用、方便的应用程序具有重要的意义和良好的市场前景。HBuilder技术作为当前最流行的操作平台,自然也存在着大量的应用服务需求。  本课题研究的是基于HBuilder技术平台的安卓的考研助手APP,开发这款安卓的考研助手APP主要是为了帮助学生可以不用约束时间

    2024年02月11日
    浏览(27)
  • uniapp app安卓 键盘监听(无input)

    如图: 要实现点击asdfhjkl任意键唤起答题说明弹窗,弹窗唤起的情况下点击enter键关闭弹窗,无弹窗的情况下点击enter键直接开始挑战   事件说明链接:HTML5+ API Reference

    2024年02月12日
    浏览(31)
  • 基于安卓android微信小程序的旅游app系统

    随着人民生活水平的提高,旅游业已经越来越大众化,而旅游业的核心是信息,不论是对旅游管理部门、对旅游企业,或是对旅游者而言,有效的获取旅游信息,都显得特别重要.自助定制游将使旅游相关信息管理工作规范化、信息化、程序化,提供旅游景点、旅游线路,旅游新闻等服务

    2024年02月06日
    浏览(32)
  • uniapp微信小程序使用stomp.js实现STOMP传输协议的实时聊天

    简介: stomp.js:原生微信小程序中使用 stomp.js:官网 stomp.js:GitHub 本来使用websocket,后端同事使用了stomp协议,导致前端也需要对应修改。 如何使用 1.yarn add stompjs 2.版本 “stompjs”: “^2.3.3” 3.在static/js中新建websocket.js,然后在需要使用的页面引入监听代码+发送代码即可 代

    2024年02月11日
    浏览(30)
  • 汽车租赁微信小程序/安卓APP的设计与实现

    💗博主介绍:✌全网粉丝10W+,CSDN全栈领域优质创作者,博客之星、掘金/华为云/阿里云等平台优质作者。 👇🏻 精彩专栏 推荐订阅👇🏻 计算机毕业设计精品项目案例-200套 🌟 文末获取源码+数据库+文档 🌟 感兴趣的可以先收藏起来,还有大家在毕设选题,项目以及论文编

    2024年02月03日
    浏览(32)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包