来自Facebook的React Native Navigator示例代码失败：类型无效：预期为字符串（用于内置组件）或类/函数

Question

相关/类似的问题正在犯一些简单的错误（属性的大小写不正确）等。我使用的代码是直接从React Native网站上提起的，因此可以肯定它应该工作。

我正在尝试使Navigator组件适应一个非常简单的现有应用程序。 我从React Native页面上的基本导航器开始： https ： //facebook.github.io/react-native/docs/using-navigators

./src/scene/myScene.jsx.js （直接从教程中提取）：

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

export default class MyScene extends Component {
  render() {
    return (
      <View>
        <Text>Current Scene: {this.props.title}</Text>

        <TouchableHighlight onPress={this.props.onForward}>
          <Text>Tap me to load the next scene</Text>
        </TouchableHighlight>

        <TouchableHighlight onPress={this.props.onBack}>
          <Text>Tap me to go back</Text>
        </TouchableHighlight>
      </View>
    )
  }
}

MyScene.propTypes = {
  title: PropTypes.string.isRequired,
  onForward: PropTypes.func.isRequired,
  onBack: PropTypes.func.isRequired,
};

index.ios.js （实际上与示例代码相同）：

import React, {Component} from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  TouchableHighlight,
  Navigator
} from 'react-native'; 
import {MyScene} from './src/scene/myScene.jsx.js'

export default class kisharNine extends Component {
  constructor(props) {
    super(props);
  }

  render() {
    return (
      <Navigator
        initialRoute={{ title: 'My Initial Scene', index: 0 }}
        renderScene={(route, navigator) =>
          <MyScene
            title={route.title}

            // Function to call when a new scene should be displayed
            onForward={() => {
              const nextIndex = route.index + 1;
              navigator.push({
                title: 'Scene ' + nextIndex,
                index: nextIndex,
              });
            }}

            // Function to call to go back to the previous scene
            onBack={() => {
              if (route.index > 0) {
                navigator.pop();
              }
            }}
          />
        }
      />
    )
  }

}

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

错误堆栈：

type is invalid: expected a string (for built-in components) or a class/function (for composite 
components) but got: undefined. Check the render method of `Navigator`.

instantiateReactComponent
    instantiateReactComponent.js:77
instantiateChild
    ReactChildReconciler.js:56
<unknown>
    ReactChildReconciler.js:88
traverseAllChildrenImpl
    traverseAllChildren.js:83

我可以看到的唯一区别是构造函数。 删除那没什么。 这可能是示例代码中的错误吗？

Answer 1

我认为的问题是从'./src/scene/myScene.jsx.js'导入{MyScene}，因为您正在执行导出默认操作，所以它应该是：从'./src/scene/myScene.jsx.js导入MyScene。 '