uniapp 获取自定义组件的高度

avatar
作者
猴君
阅读量:1

在 UniApp 中,要获取自定义组件的高度,可以使用uni.createSelectorQuery()方法结合res.noderes.height来实现。

首先,在父组件的代码中,给自定义组件添加一个 ref 属性,例如:

<template>   <view>     <tab-bars ref="tabBars" :choose_index="2"></tab-bars>   </view> </template> 

然后,在父组件的 mounted 钩子函数中,使用 uni.createSelectorQuery() 来获取自定义组件的高度,如下所示:

<script> export default {   mounted() {     this.$nextTick(() => {       uni.createSelectorQuery().in(this.$refs.tabBars)         .select('.tab-bars')         .boundingClientRect((res) => {           console.log('自定义组件的高度:', res.height);         })         .exec();     });   }, }; </script> 

上述代码中,uni.createSelectorQuery() 用于创建查询对象,in(this.$refs.tabBars) 用于指定查询的节点为自定义组件(通过ref属性获取),.select('.tab-bars') 用于选择自定义组件的类名为 .tab-bars 的节点,.boundingClientRect() 用于获取该节点的位置和尺寸信息。最后,通过 .exec() 执行查询操作,并在回调函数中获取自定义组件的高度。

***请确保 .tab-bars 是自定义组件的类名,根据实际情况进行调整。***

广告一刻

为您即时展示最新活动产品广告消息,让您随时掌握产品活动新动态!