react-native – 修改index.js后的黑屏

发布时间：2020-12-15 09:31:48 所属栏目：百科来源：网络整理

导读：我正在线上学习如何使用React. 教师让我创建了一个名为专辑的项目并修改了index.js的内容,但是我在ios模拟器上得到了一个黑屏. 我做了什么(遵循教练的详细信息)： 1)创建一个新项目react-native init-albums 2)使用cd album输入项目目录 3)运行react-native

我正在线上学习如何使用React.

教师让我创建了一个名为专辑的项目并修改了index.js的内容,但是我在ios模拟器上得到了一个黑屏.

我做了什么(遵循教练的详细信息)：

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

2)使用cd album输入项目目录

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但它没有.屏幕是黑色的.
我究竟做错了什么？

解决方法

您需要为您的应用程序定义背景颜色.您还应该从react-native导入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];

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!