javascript - react-native-router-flux 无法改变背景颜色

Question

我最近升级了我所有的依赖项，现在我的应用程序的背景在每个页面上都是永久灰色的。

我不知道为什么，但已将范围缩小到 react-native-router-flux 无法识别过去有效的 backgroundColor 属性这一事实。

我试过把它放在任何地方，但这些解决方案都不起作用:

App.js

    return (
    <View style={{
        alignContent: 'center',
        justifyContent: 'center',
        height: Dimensions.get('window').height,
        width: Dimensions.get('window').width,
        backgroundColor: 'pink'
      }}>
      <StatusBar hidden={true} />
      <Provider store={store}>
        <Router sceneStyle={{backgroundColor: 'pink'}} />
      </Provider>
    </View>
)

在 Router.js 中

const RouterComponent = () => {
  return (
    <Router sceneStyle={{backgroundColor: 'pink'}}>
      <Scene key="root" duration={0} sceneStyle={{backgroundColor: 'pink'}}>
          <Scene key="main" sceneStyle={{backgroundColor: 'pink', alignItems: 'center', justifyContent: 'center'}} hideNavBar={true}>
            <Scene key="dashboard" component={DashboardContainer} hideNavBar={true} initial sceneStyle={{backgroundColor: 'pink'}} />
          </Scene>
        </Scene>
    </Router>
  )
}

我几乎在文档建议的任何地方都添加了 backgroundColor: 'pink'。我有什么不明白的？

"react-native-router-flux": "^4.3.1","react-native": "0.68.2",“ react ”:“17.0.2”，

附言。我知道我可以单独设置每个组件的颜色，但在我更新它之前，我可以设置整个应用程序的背景颜色，这就是我想要做的。

Answer 1

我没有使用 react-native-router-flux，但简单的方法是:制作一个如下所示的自定义组件并在任何地方使用它:

const MyCustomView = props => {
 return(
   <View style={{backgroundColor:'pink'}}>
    {children}
   </View>
  );
 }
 export default MyCustomView;