RN—获取状态栏高度

1、方法一

安装组件

npm install react-native-status-bar-height

使用

import { getStatusBarHeight } from 'react-native-status-bar-height';

export default function FirstLoginPage(){
    return (
        <View style={[styles.container,{paddingTop: getStatusBarHeight()}]}>
            <View style={styles.backMenu}></View>
            <View style={styles.content}></View>

            {/* <Back /> */}
        </View>
    );
}

二、方法二

安装组件

npm install react-native-safe-area-context

使用

import { useSafeAreaInsets } from "react-native-safe-area-context";

export default function FirstLoginPage(){
    const insets = useSafeAreaInsets();

    const statusBarHeight = Platform.select({
        ios: insets.top,
        android: StatusBar.currentHeight,
        default: 0,
    });

    return (
        <View style={[styles.container,{paddingTop: statusBarHeight}]}>
            <View style={styles.backMenu}></View>
            <View style={styles.content}></View>

            {/* <Back /> */}
        </View>
    );
}