ui-body-height 内容区域高度组件

版本：v2.3.11

内容区域高度组件用于获取和设置页面内容区域的高度，适用于各种平台。

基本使用

<template>
  <div class="body-height-demo">
    <ui-body-height ref="bodyHeightRef">
      <div class="content">
        <!-- 内容区域 -->
      </div>
    </ui-body-height>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue';
const bodyHeightRef = ref(null);

onMounted(() => {
  console.log('内容区域高度:', bodyHeightRef.value.height);
});
</script>

<style scoped>
.content {
  background: #f0f0f0;
  padding: 20px;
}
</style>

Props

参数	类型	默认值	说明
safeAreaInsetBottom	Boolean	false	是否包含底部安全区域
safeAreaInsetTop	Boolean	false	是否包含顶部安全区域

Methods

方法名	说明	参数	返回值
getHeight	获取内容区域高度	-	Number 内容区域高度

在线演示

扫码或点击链接在手机上查看完整演示

https://shadow-ui3-demo.nooko.cn/#/pages/base/body-height/body-height