【uniapp】uniapp设置安全区域：

最新推荐文章于 2024-12-01 20:47:57 发布

Sun Peng

最新推荐文章于 2024-12-01 20:47:57 发布

阅读量4.1k

点赞数 2

分类专栏：小程序端文章标签： uni-app chrome javascript

本文链接：https://blog.csdn.net/weixin_53791978/article/details/132225575

版权

小程序端专栏收录该内容

57 篇文章

订阅专栏

文章目录

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

一、效果图:

在这里插入图片描述

二、实现代码:

{
	"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>