t-safe-bottom

SafeBottom 安全底部

组件介绍

底部安全区组件，自动获取状态栏高度占位，H5端高度一般获取为0。

平台兼容

Harmony	H5	Android	iOS	小程序	UTS
✅	✅	✅	✅	✅	✅

基础用法

<template>
  <view class="page">
    <view class="content">
      <!-- 页面内容 -->
    </view>
    <t-safe-bottom></t-safe-bottom>
  </view>
</template>

<style scoped>
.page {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.content {
  flex: 1;
  padding: 20rpx;
}
</style>

Slots

插槽名	说明
default	内容插槽，可以在安全区域内放置内容