uniapp获取系统信息和元素的动态高度
在开发中我们需要获取屏幕的高度以及某个元素的高度,根据官网提供的我们会使用以下方式
uni.getSystemInfo({
success: function(res) { // res - 各种参数
console.log(res.windowWidth); // 屏幕的宽度
let info = uni.createSelectorQuery().select(".类名");
info.boundingClientRect(function(data) { //data - 各种参数
console.log(data.width) // 获取元素宽度
}).exec()
}
});
但在测试中会发现获取的data为null,在经历了多次碰壁之后发现使用以下方式是可以获取到元素的高度的
onReady(){
var that=this;
that.getDescBox ();
uni.getSystemInfo({
success: function(res) { // res - 各种参数
that.height=res.screenHeight;
console.log(that.height,'height')
}
});
},
methods: {
getDescBox () {
uni.createSelectorQuery().in(this).select('.wrap').boundingClientRect(result => {
if (result) {
console.log(result)
this.wrapHeight=result.height;
console.log(this.wrapHeight,'this.wrapHeight')
} else {
this.getDescBox()
}
}).exec()
},
}