uniapp 获取自定义组件的高度

在 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 是自定义组件的类名,根据实际情况进行调整。***

相关推荐

  1. uniapp 获取定义组件高度

    2024-07-18 07:42:02       23 阅读
  2. uniapp——定义导航栏封装

    2024-07-18 07:42:02       57 阅读
  3. 定义Application,获取全局Context

    2024-07-18 07:42:02       29 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-18 07:42:02       66 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-18 07:42:02       70 阅读
  3. 在Django里面运行非项目文件

    2024-07-18 07:42:02       57 阅读
  4. Python语言-面向对象

    2024-07-18 07:42:02       68 阅读

热门阅读

  1. 控制台小游戏制作——贪吃蛇

    2024-07-18 07:42:02       18 阅读
  2. Python高级函数技术:闭包、装饰器与回调

    2024-07-18 07:42:02       23 阅读
  3. 07. Hibernate 会话工厂(SessionFactory)

    2024-07-18 07:42:02       21 阅读
  4. 网络抓包工具tcpdump的使用

    2024-07-18 07:42:02       22 阅读
  5. 构建之源:深入解析Gradle的settings.gradle文件

    2024-07-18 07:42:02       21 阅读
  6. 构建Scala项目的魔法:Gradle中配置Scala插件

    2024-07-18 07:42:02       22 阅读
  7. Starrocks创建物化视图时不能写select *

    2024-07-18 07:42:02       20 阅读
  8. C语言——指针简介及基本要点

    2024-07-18 07:42:02       20 阅读
  9. uniapp小程序项目解决键盘问题

    2024-07-18 07:42:02       21 阅读
  10. C# 类型的默认值

    2024-07-18 07:42:02       20 阅读
  11. [PostgreSql]获取表结构数据

    2024-07-18 07:42:02       19 阅读