【uniapp】uniapp设置安全区域：

文章目录

• • • • 一、效果图:
      • 二、实现代码:

---

一、效果图:

二、实现代码:

{
	"path": "pages/index/index",
	"style": {
		"navigationStyle": "custom",
		"navigationBarTextStyle": "white",
		"navigationBarTitleText": "首页"
	}
},

<script setup lang="ts">
// 获取屏幕边界到安全区域距离
const { safeAreaInsets } = uni.getSystemInfoSync()
</script>

<template>
  <view class="navbar" :style="{ paddingTop: safeAreaInsets?.top + 'px' }">
	....
  </view>
</template>