Uniapp中如何获取某个组件的高度

作者:菠萝爱吃肉2024.02.18 23:33浏览量:11

简介:在Uniapp中,如果你想要获取某个组件的高度,你可以使用uni.createSelectorQuery()这个API。这个API可以用来查询节点信息,包括组件的高度。下面是一个示例代码:

在Uniapp中,如果你想要获取某个组件的高度,你可以使用uni.createSelectorQuery()这个API。这个API可以用来查询节点信息,包括组件的高度。下面是一个示例代码:

  1. // 在onReady生命周期中获取组件高度
  2. onReady: function() {
  3. let that = this;
  4. uni.getSystemInfo({ // 获取系统信息
  5. success: function(res) {
  6. // res - 各种参数
  7. console.log(res.windowHeight); // 屏幕的宽度
  8. let info = uni.createSelectorQuery().select('.getHeight'); // 获取某个元素,这里假设你要获取的组件类名为getHeight
  9. info.boundingClientRect(function(rect) {
  10. console.log(rect.height); // 打印高度
  11. });
  12. }
  13. });
  14. }

这段代码首先通过uni.getSystemInfo()获取系统信息,然后通过uni.createSelectorQuery().select(‘.getHeight’)获取到类名为getHeight的组件,并使用boundingClientRect()方法获取到该组件的矩形区域信息,包括高度。最后,打印出这个高度值。

需要注意的是,这段代码中的’.getHeight’应该替换为你实际要获取高度的组件的类名。另外,这段代码需要在组件的onReady生命周期中执行,因为在这个时候,组件已经渲染完成,高度信息也已经被计算出来。

希望这段代码能够帮助到你。如果你还有其他问题,欢迎随时提问。