React Native 状态栏颜色错误答案

【问题标题】：React Native Statusbar wrong colorReact Native 状态栏颜色错误
【发布时间】：2018-07-05 14:59:54
【问题描述】：

我有一个带有多个屏幕的 react 本机应用程序。每个组件都有自己的状态栏来定义其颜色（参见代码前组件）。启动应用程序时，会显示正确的颜色，但是当我进入使用另一种颜色（黑色而不是白色，反之亦然）的屏幕时，它会正确更改，但之后在进一步导航时不会再更改。颜色好像只能换一次。

render() {
  return (
    <View style={theme.container}>
      <StatusBar
        translucent={false}
        backgroundColor={S.COLOR_STATUS_BAR_DARK}
        barStyle="dark-content"
      />
      {this.props.isFetching || this.props.isSubmitting
        ? <Spinner />
        :
        <View style={theme.container}>
          { this.renderAlarms() }
        </View>
      }
    </View>
  );
}

我在这里做错了吗？

【问题讨论】：

标签： react-native statusbar

【解决方案1】：

我认为您的组件没有重新渲染。
A ---> B
当 A 渲染。状态栏颜色：红色
当 B 渲染。状态栏颜色：蓝色
回到 A。A 没有重新渲染。状态栏颜色：蓝色，

如果A组件重新渲染，这个问题就解决了。

【讨论】：

【解决方案2】：

重新渲染组件确实起到了作用。感谢您的反馈。

【讨论】：

如果这是正确的解决方案，则将答案标记为正确（绿色检查图像），如果有帮助，请点赞我的评论。

【解决方案3】：

您还可以使用静态setBackgroundColor 函数更改状态的颜色。

我建议您在componentDidMount 或componentWillMount 和componentWillUnmount 上设置您的状态颜色以设置回之前的状态颜色，如下例所示。

componentDidMount() {
  StatusBar.setBackgroundColor('red');
}
componentWillUnmount() {
  StatusBar.setBackgroundColor('white');
}

【讨论】：