在react-native中运行应用程序时出错

Question

我的App.js文件代码是这样的

import { createAppContainer } from "react-navigation";
import { createStackNavigator } from "react-navigation-stack";
import IndexScreen from "./src/screen/IndexScreen";
const navigator = createStackNavigator({
  Home: {
    screen: IndexScreen
  }
});

export default createAppContainer(navigator);

我的index.js文件就像

import { React } from "react";
import { View, Text, StyleSheet } from "react-native";
const IndexScreen = () => {
  return (
    <View>
      <Text>IndexScreeen</Text>
    </View>
  );
};
const styles = StyleSheet.create({});

export default IndexScreen;

但是运行该应用程序后，出现此错误。

我的错误是什么

Answer 1

您正在导入import IndexScreen from "./src/screen/IndexScreen";，并说您的文件名为index.js，对吗？

顺便说一句，尝试import { React } from "react";时出现错误。但是，如果我尝试import React from "react";，它会起作用。

Answer 2

三件事：

1. 您要导入IndexScreen，而不是index.js

2. 不是import { React } from "react";。是import React from "react";

3. 您正在使用const从文件中导出。导出以将其用作反应组件，您可能应该这样做：

    class IndexScreen extends React.Component {
        render() {return (
            <View>
                <Text>IndexScreeen</Text>
            </View>
          );
        }
    }

Answer 3

最终解决了这个问题，实际上我在导入后没有添加换行符或空白行的情况下定义了一个功能组件是一个错误。