<template>
  <view class="nana-xbar-space" :style="`height:${safeAreaBottom}px;`"></view>
</template>

<script setup lang="ts">
const systemInfo = uni.getSystemInfoSync();
const safeAreaBottom = systemInfo.safeAreaInsets?.bottom || 0;// 底部安全区距离

defineOptions({
  options: {
    virtualHost: true,
    styleIsolation: "shared",
  }
})
</script>

<style>
.nana-xbar-space {
  display: flex;
  width: 100%;
  flex-shrink: 0;
}

</style>