首页 > 其他分享 >uniapp获取元素高度不准确问题解决

uniapp获取元素高度不准确问题解决

时间:2025-01-18 22:59:11浏览次数:1  
标签:uniapp 缩放 元素 高度 乘以 获取 文章

uniapp通过boundingClientRect获取的元素高度和实际高度差了不少,下面是复现和解决过程:

我的代码:

 

得到的结果:

 

高度只有105

用工具量一下:

 

实际有240px,遂gpt问下:

 

注意到了缩放比这个之前没想到的点,往下面看gpt更多的回复内容:

 

先获取系统缩放比,再乘以拿到的高度。

但是就算乘以2,也还差了不少,105*2才等于210,和240还有差距,这些差距我的想法是自己补齐,具体做法见:

 

乘以2后多加50,这样就能补齐差距了。

最终结果:

 

这是我的做法,如果大家有更好的做法,还烦请评论区告知。

这篇分享文章就到这里啦!如果你对文章内容有疑问或想要深入讨论,欢迎在评论区留言,我会尽力回答。同时,如果你觉得这篇文章对你有帮助,不妨点个赞并分享给其他同学,让更多人受益。

想要了解更多相关知识,可以查看我以往的文章,其中有许多精彩内容。记得关注我,获取及时更新,我们可以一起学习、讨论技术,共同进步。

感谢你的阅读与支持,期待在未来的文章中与你再次相遇!

我的微信公众号:【xdub】,欢迎大家订阅,我会同步文章到公众号上。

标签:uniapp,缩放,元素,高度,乘以,获取,文章
From: https://www.cnblogs.com/shuinanxun/p/18679008

相关文章

  • 基于php的旅游网站旅游系统广西旅游网站php+mysql毕业设计php源码获取课程设计毕设指
    一、功能介绍该网站主题是旅游相关,实现了旅游景点、美食以及酒店的预定功能,并且实现了在线论坛。前台功能首页:旅游信息、酒店信息、美食信息旅游美食:列表、详情、下单酒店:列表、详情、下单景点:列表、详情、下单购物车、去下单、订单信息、评论在线论坛用户中心:我的订......
  • 有一个包含开始日期和结束日期的数组,获取最小的日期和最大的日期,用java实现
    packagecom.cfb.oa.m;importjava.time.LocalDate;importjava.util.ArrayList;importjava.util.List;classDateRange{LocalDatestartDate;LocalDateendDate;publicDateRange(LocalDatestartDate,LocalDateendDate){this.startDate......
  • Vue.js 组件开发:构建可复用的UI元素
    ......
  • 记一次GM220-S获取超级管理员密码的过程
    此方法只适用自己手上有逻辑ID的方法,事实上可以直接找宽带师傅要密码一、恢复出厂设置1.拔网线2.恢复出厂设置用细铁丝按住侧边的恢复出厂设置按钮,全亮之后灭了继续按别放手所有灯又再次变亮后又闪了俩遍后就可以松手了!全程最少20秒!二、开启telnethttp://192.168.1.1/usr=CM......
  • 多监控m3u8视频流,怎么获取每个监控的封面图(纯前端)
    文章目录1.背景2.问题分析3.解决方案3.1解决思路3.2解决过程3.2.1封装播放组件3.2.2隐形的视频div3.2.3截取封面图3.3结束1.背景有这样一个需求:给你一个监控列表,每页展示多个监控(至少12个,m3u8格式);且展示每个监控的第一帧画面的封面图,但是后端没给你返回封面图......
  • JAVA:根据经纬度获取夏令时以及偏移(免费)
    注:国内根据经纬度来获取夏令时区以及时区偏移量的api的服务有百度和谷歌,但是谷歌的获取夏令时和时区的api在国内服务其上部署时访问不了的(看过有在服务器上安装代理的,但是操作有点复杂。好吧,其实是我看着步骤太多,感觉太麻烦所以直接pass了)。所以目前在我获取到的信息中,只有百......
  • HTML应用指南:利用GET请求获取星巴克门店数据
    本篇文章,我们将探究GET请求的实际应用,我们使用Python的requests库通过GET请求抓取星巴克门店信息。星巴克作为全球知名的咖啡连锁品牌,其门店分布广泛,获取这些门店的信息对于数据分析、市场研究以及商业决策都具有重要意义。我们将以获取全国的星巴克门店为例,详细讲解请求的构......
  • HTML应用指南:利用GET请求获取全国特斯拉充电桩位置
    随着电动汽车的普及,充电基础设施的建设变得至关重要。作为电动汽车领域的先驱,特斯拉不仅在车辆技术创新上持续领先,还积极构建广泛的充电网络,以支持其不断增长的用户群体。为了提升用户体验和服务质量,开发人员和数据分析师经常需要访问特斯拉充电桩的位置信息,并将其集成到导航......
  • 股票API接口使用python、JAVA等多种语言实例代码演示免费获取实时数据、历史数据、CDM
    ​最新整理的股票API接口,下方所有接口链接均可直接点击验证,查看返回的数据。沪深两市股票列表股票API接口链接(可点击验证):https://api.mairui.club/hslt/list/LICENCE-66D8-9F96-0C7F0FBCD073【实时数据接口】沪深两市实时交易数据接口股票API接口链接(可点击验证):https:......
  • 算法2-25 有序单链表删除重复元素(附加代码模式)
    题目描述根据一个递增的整数序列构造有序单链表,删除其中的重复元素本题是附加代码模式,主函数main和打印链表的代码会自动附加在同学们提交的代码后面,请同学们在提交的时候注释附加代码。附加代码如下:void PrintList(const List &list){    Node *p = list->nex......