javascript - 使用单个条目文件来 react native 应用程序

Question

我正在尝试在 React Native 应用程序中为 android 和 iOS 使用单个入口文件。

我已经学习了一些教程并得到了以下结果:

索引.js

import React, { Component } from 'react';
import { Text } from 'react-native';

export default class Main extends Component {
   render() {
      return (
        <Text>Hello world! from both IOS and Android</Text>
      );
   }
}

index.ios.js

import React from 'react';
import { AppRegistry } from 'react-native';
import {Main} from './index';


AppRegistry.registerComponent('Main', () => Main);

我最终遇到以下错误:

元素类型无效:应为字符串(对于内置组件)或类/函数(对于复合组件)但得到:未定义。您可能忘记了从定义组件的文件中导出组件。

如果我在导入语句中从 Main 中删除花括号，它会显示“...但得到:对象”，所以我觉得这与我的导出/导入有关，但似乎没有任何效果。任何帮助将不胜感激。

Answer 1

您正在将 Main 组件导出为:

export default class Main extends Component {

但导入为:

import {Main} from './index';

默认导出应该导入为:

import Main from './index';

如果你使用默认导出，你必须像这样导入。如果这不起作用，则您的代码中一定存在其他问题。