一、获取view宽高度
给view设置一个id(class)名,用法和jQuery类似,用来获取指定id相关信息。
<view id="test">测试view</view>
把方法写在onReady,是为了再页面初次渲染完成后,再去获取,避免不准确或获取不到的情况。
onReady: function (e) {
const query = wx.createSelectorQuery();
query.select('#test').boundingClientRect(function (res) {
console.log(res)
}).exec()
}
输出结果:
二、获取自定义组件宽高度
获取自定义组件的相关信息,与获取view信息基本一致,只需要把const query = wx.createSelectorQuery()替换成const query = wx.createSelectorQuery().in(this)就可以了。
const query = wx.createSelectorQuery().in(this);
query.select('#test').boundingClientRect(function (res) {
console.log(res)
}).exec()
但是在实际使用的时候,却发现一个问题,这样是能获取到组件的相关信息,但是高度却和实际的有误差:
如图,获取到组件高度为603,而实际#test组件高度为160,这就有点坑了,不知道大家有没有遇到这样的情况???