android - React Native - 一个全新的应用程序只显示黑屏。如何调试？

Question

我开始探索使用 React Native 构建移动应用程序并运行，即使在学习了很多教程之后，仍然遇到重复问题。

我通过 react-native init MyApp 生成了一个新的应用程序命令 - 我注意到在 App.js文件包含这些样式定义:

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

但是，如果我决定只使用

export default class App extends Component {
  render() {
    return (
      <View>
        <Header />
      </View>
    );
  }
}

我只在模拟器中得到一个黑屏 - 要“看到”一些东西，我需要添加样式定义，如:

<View style={styles.container}>
  <Header />
</View>

如何避免总是为 <View> 指定样式定义？ ？屏幕背景是黑色的默认设置还是我忽略了什么？

到目前为止 - 开发相当困惑和困难，我基本上整个下午都在重新启动 iOS 应用程序(热重载并不总是有效)以查看应用程序中的新代码更改，而不是构建一些新功能。

我是不是做错了什么(比如使用了错误的开发工具)？

Answer 1

如果您查看 AppDelegate.m，您会看到 rootView 的颜色设置如下

rootView.backgroundColor = [UIColor blackColor];

这会将默认颜色设置为黑色，您可以将其更改为任何您想要的颜色。

但是它不会影响您在 Android 上所做的任何事情，因此最好只在 View 中设置背景颜色。