React Native:React Navigation Issue

时间:2017-11-09 23:00:57

标签: reactjs react-native expo react-native-navigation

有人能告诉我我做错了吗?

我是React Native的新手,我从这里开始关注React Navigator的示例。

该应用程序是通过Expo IDE开发的。

https://reactnavigation.org/docs/intro/quick-start

这是我的App.js的src代码

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { RootNavigator } from './src/RootNavigator';

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <RootNavigator />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

这是我的RootNavigator.js的src代码

import React from 'react';
import { View, Text } from 'react-native';
import { StackNavigator } from 'react-navigation';

const HomeScreen = () => (
  <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
    <Text>Home Screen</Text>
  </View>
);

const DetailsScreen = () => (
  <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
    <Text>Details Screen</Text>
  </View>
);

const RootNavigator = StackNavigator({
  Home: {
    screen: HomeScreen,
    navigationOptions: {
      headerTitle: 'Home',
    },
  },
  Details: {
    screen: DetailsScreen,
    navigationOptions: {
      headerTitle: 'Details',
    },
  },
});

export default RootNavigator;

Rootnavigator.js位于src文件夹内(附截图截图)

enter image description here

尝试在iphone中运行时出现此错误。

enter image description here

1 个答案:

答案 0 :(得分:3)

您正在执行export default App这是一个未命名的导出,因此您需要更改:

import { RootNavigator } from './src/RootNavigator';

import RootNavigator from './src/RootNavigator';

有关es6 import / export的更多信息,请访问:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export