ReactNative 中整个应用程序的背景图像

Question

在 React Native 中，我们有 ImageBackground 组件，它将在控制器中显示背景图像。 我想为所有控制器使用相同的背景图像。 不是在所有控制器中都写它，有没有办法为整个应用程序设置背景图像？

Answer 1

一种简单的方法是定义一个 MainComponent，它始终是屏幕的父视图。 您可以使用{this.props.children}轻松注入子视图。

请参阅下面的简化示例：

主要组件：

class MainComponent extends Component {

   render() {

      return (
         <View style ...>
            <ImageBackground .../> 
          {this.props.children}
         </View>
      );
   } 
}

控制器：

import MainComponent from 'yourPATH'

class Controller extends Component {

   render() {
      return (
         <MainComponent>

          //ADD YOUR Regular Controller Screen here. 

         </MainComponent>
      );
   } 
}

您可以在此处阅读更多相关信息： https : //reactjs.org/docs/composition-vs-inheritance.html