Safe Area - 安全区域

一个用于获取设备安全区域信息的Hook,可以获取顶部状态栏、底部导航栏等安全区域的高度,帮助开发者更好地适配全面屏设备。

图解

Safe Area - 安全区域

源代码

import { getWindowInfo } from '@tarojs/taro';

export default function useSafeArea() {
  const { safeArea, screenHeight } = getWindowInfo();

  const safeButtom = screenHeight - (safeArea?.bottom ?? 0);

  return {
    buttom: safeButtom,
    height: safeArea?.height ?? 0,
    top: safeArea?.top ?? 0,
  };
}