当前位置:网站首页>微信小程序获取某个元素的信息(高、宽等),并将px转换为rpx。
微信小程序获取某个元素的信息(高、宽等),并将px转换为rpx。
2022-07-02 23:09:00 【Pumpkin_xiaoXuan】
<!-- 自定义底部导航栏 这里得定义个class跟下方的.select()一致-->
<tab-bar class="tabbar" :currentTabBar="0" :themeColors="themeColors"></tab-bar>
// 获取底部导航栏高度
getTabBarHeight() {
let query = uni.createSelectorQuery().in(this);
query
.select(".tabbar") // 这里的.tabbar为该元素的类名
.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);
})
},
// 调用时需要等dom渲染完毕再调用
this.$nextTick(() => {
this.getFixedItemInfo()
this.getTabBarHeight()
})
// 这里是把拿到的高度转换为rpx,因为在不同机型下 px转rpx是不一致的
let system = uni.getSystemInfoSync();
let tabBarHeightPx = res[0].height;
let rpx = system.windowWidth / 750;
this.tabBarHeightRpx = tabBarHeightPx / rpx
边栏推荐
- 论文的设计方案咋写?
- MySQL advanced learning notes (4)
- NC50528 滑动窗口
- Pytorch 20 realizes corrosion expansion based on pytorch
- Monitor container runtime tool Falco
- Redis21 classic interview questions, extreme pull interviewer
- Analyze ad654: Marketing Analytics
- [shutter] image component (image component introduction | image constructor | image.network constructor | image.asset constructor)
- pod生命周期详解
- Free we media essential tools sharing
猜你喜欢
Happy Lantern Festival, how many of these technical lantern riddles can you guess correctly?
哪些软件可以整篇翻译英文论文?
[shutter] Introduction to the official example of shutter Gallery (learning example | email application | retail application | wealth management application | travel application | news application | a
setInterval定时器在ie不生效原因之一:回调的是箭头函数
教育学大佬是怎么找外文参考文献的?
Chapter 3 of getting started with MySQL: database creation and operation
Improvement of RTP receiving and sending PS stream tool (II)
pageoffice-之bug修改之旅
Feature Engineering: summary of common feature transformation methods
Open source | Wenxin big model Ernie tiny lightweight technology, which is accurate and fast, and the effect is fully open
随机推荐
Luogu_ P2010 [noip2016 popularization group] reply date_ Half enumeration
Pageoffice - bug modification journey
数组常用操作方法整理(包含es6)及详细使用
Interface automation coverage statistics - used by Jacobo
[shutter] image component (image component introduction | image constructor | image.network constructor | image.asset constructor)
pod生命周期详解
Additional: token; (don't read until you finish writing...)
Leetcode skimming - game 280
NC50528 滑动窗口
Unique line of "Gelu"
Program analysis and Optimization - 9 appendix XLA buffer assignment
AcWing_188. 武士风度的牛_bfs
国外的论文在那找?
论文的设计方案咋写?
Question e: merged fruit -noip2004tgt2
[target detection] r-cnn, fast r-cnn, fast r-cnn learning
zhvoice
[shutter] open the third-party shutter project
TypeError: Cannot read properties of undefined (reading ***)
Define MySQL function to realize multi module call