当前位置:网站首页>Wechat applet obtains the information of an element (height, width, etc.) and converts PX to rpx.
Wechat applet obtains the information of an element (height, width, etc.) and converts PX to rpx.
2022-07-03 00:28:00 【Pumpkin_ xiaoXuan】
<!-- Customize the bottom navigation bar Here we have to define class Below heel .select() Agreement -->
<tab-bar class="tabbar" :currentTabBar="0" :themeColors="themeColors"></tab-bar>
// Get the height of the bottom navigation bar
getTabBarHeight() {
let query = uni.createSelectorQuery().in(this);
query
.select(".tabbar") // there .tabbar Is the class name of the element
.boundingClientRect()
.exec((res) => {
let system = uni.getSystemInfoSync();
let tabBarHeightPx = res[0].height;
let rpx = system.windowWidth / 750;
this.tabBarHeightRpx = tabBarHeightPx / rpx
console.log('tabBarHeightRpx', this.tabBarHeightRpx);
})
},
// You need to wait while calling dom Call after rendering
this.$nextTick(() => {
this.getFixedItemInfo()
this.getTabBarHeight()
})
// Here is to convert the obtained height into rpx, Because in different models px turn rpx It's inconsistent
let system = uni.getSystemInfoSync();
let tabBarHeightPx = res[0].height;
let rpx = system.windowWidth / 750;
this.tabBarHeightRpx = tabBarHeightPx / rpx
边栏推荐
- logback配置文件
- Andorid 获取系统标题栏高度
- Bloom filter
- What website can you find English literature on?
- What are the projects of metauniverse and what are the companies of metauniverse
- Don't want teachers to see themselves with cameras in online classes? Virtual camera you deserve!
- Slf4j + Logback日志框架
- 关于Unity屏幕相关Screen的练习题目,Unity内部环绕某点做运动
- Markdown tutorial
- Free we media essential tools sharing
猜你喜欢
Bigder: how to deal with the bugs found in the 32/100 test if they are not bugs
DotNet圈里一个优秀的ORM——FreeSql
奥斯陆大学:Li Meng | 基于Swin-Transformer的深度强化学习
洛谷_P1149 [NOIP2008 提高组] 火柴棒等式_枚举打表
Understanding and application of least square method
Chapter 3 of getting started with MySQL: database creation and operation
Digital twin visualization solution digital twin visualization 3D platform
ftrace工具的介绍及使用
洛谷_P2010 [NOIP2016 普及组] 回文日期_折半枚举
Digital twin smart factory develops digital twin factory solutions
随机推荐
在线预览Word文档
NC50528 滑动窗口
免费自媒体必备工具分享
CMake基本使用
教育学大佬是怎么找外文参考文献的?
Leetcode skimming - game 280
【雅思阅读】王希伟阅读P2(阅读填空)
[shutter] Introduction to the official example of shutter Gallery (project introduction | engineering construction)
Don't want teachers to see themselves with cameras in online classes? Virtual camera you deserve!
Pat 1030 travel plan (30 points) (unfinished)
About the practice topic of screen related to unity screen, unity moves around a certain point inside
pod生命周期详解
FRP reverse proxy +msf get shell
Markdown tutorial
为什么网站打开速度慢?
Custom throttling function six steps to deal with complex requirements
Where can I check the foreign literature of economics?
Bigder:32/100 测试发现的bug开发认为不是bug怎么处理
程序分析与优化 - 9 附录 XLA的缓冲区指派
秒杀系统设计