Question

我正在关注在线教程，以学习如何使用React。

教师让我创建了一个名为albums的项目并修改了index.js的内容，但是在ios模拟器上却出现了黑屏。

我做了什么（遵循讲师的详细信息）：

1）创建一个新项目react-native init-albums

2）使用cd albums

输入项目目录

3）运行react-native run-ios

4）我可以在模拟器屏幕上看到App.js文件中的内容（初始屏幕为-我假设-任何新的React Native项目）。 按Cmd + R重新加载， Cmd + D或为开发菜单摇动等。

5）删除index.js中的内容，并将其替换为：

import React from "react";
import { AppRegistry, Text } from "react-native";

const App = () => {
 return <Text>Some Text</Text>;
};

AppRegistry.registerComponent("albums", () => App);

它应该在模拟器的左上方显示 Some Text ，但不是。屏幕是黑色的。我在做什么错了？

Answer 1

您需要为应用程序定义背景色。您还应该从本机导入View

import { AppRegistry, Text, View } from "react-native";

const App = () => {
 return (
   <View style={{backgroundColor: 'white', flex:1}}>
     <Text>Some Text</Text>
   </View>
  );
};

它是黑色的原因是因为AppDelegate.m中的rootView backgroundColor在版本0.58.0中已更改

以前的版本是

rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];

0.58.+中的以下内容

rootView.backgroundColor = [UIColor blackColor];

修改index.js后出现黑屏

1 个答案: