使用 React Native 隐藏状态栏

Question

使用 React Native 开发时如何隐藏 iOS 或 Android 的状态栏？我已经导入了 StatusBar，但我相信还有 StatusBarIOS 和 Android 的 StatusBar。

原文由 Rheisen 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

想出了如何隐藏状态栏。首先，StatusBarIOS 已被 弃用，因此您需要导入 StatusBar 然后只需在渲染顶部包含此代码片段：

 <StatusBar hidden />

React Native Docs on StatusBar

原文由 Rheisen 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

您可以从组件中的任何位置调用此方法：

 import React, { Component } from 'react';
import { StatusBar } from 'react-native';

class MyComponent extends Component {

    componentDidMount() {
       StatusBar.setHidden(true);
    }
}

编辑：

这将隐藏整个应用程序的状态栏，而不仅仅是在您的特定组件中，要解决这个问题，您可以这样做：

 componentWillUnmount() {
     StatusBar.setHidden(false);
}

或者从其他地方用 false 调用这个方法。

原文由 Nir Ben-Yair 发布，翻译遵循 CC BY-SA 4.0 许可协议