Javascript 添加额外填充的状态栏

我尝试将状态栏添加到应用程序中，它在React导航标题上添加了额外的填充

状态条形码

const STATUSBAR_HEIGHT = Platform.OS === 'ios' ? 30 : StatusBar.currentHeight;
const NotificationBar = ({ backgroundColor, ...props }) => ({
  ...(Platform.OS == 'ios' ? (
    <View style={{ backgroundColor, height: 30 }}>
      <StatusBar translucent backgroundColor={backgroundColor} {...props} />
    </View>
  ) : (
    <StatusBar translucent backgroundColor={backgroundColor} {...props} />
  )),
});

const styles = StyleSheet.create({
  statusBar: {
    height: STATUSBAR_HEIGHT,
  },
});

const STATUSBAR\u HEIGHT=Platform.OS==“ios”？30：状态栏。当前高度；
const NotificationBar=（{backgroundColor，…props}）=>({
…（Platform.OS=='ios'(
) : (
)),
});
const styles=StyleSheet.create({
状态栏：{
高度：状态栏高度，
},
});

app.js

 <Provider store={store}>
      <NotificationBar
        backgroundColor={Colors.SAPrimaryx}
        barStyle="light-content"
      />
      <PersistGate persistor={persistor}>
        <RootRouter />
      </PersistGate>
 </Provider>

---

如何修复它？

您不应该设置

视图

高度，它会增加额外的高度。你可以按此操作

---

我没有添加状态栏，而是更改了状态栏内容的颜色

  <Provider store={store}>
      <StatusBar barStyle="dark-content" />
      <PersistGate persistor={persistor}>
        <RootRouter />
      </PersistGate>
    </Provider>