从同一个 JS 文件导入屏幕

Question

我已在 StackOverflow 中咨询过有关此问题的所有问题，但均未成功。我不断收到以下错误 `Route 'Home' 应该声明一个屏幕。

这个错误似乎表明如果我想将一个组件用作屏幕，我必须将它导入到我的工作文件中，是这样吗？如果是这样，为什么？这可能是我的代码有问题，否则，我不确定这里有什么问题：我想了解为什么这不起作用，我已经咨询了有关该主题的多个指南。

我的index.android.js：

import './app/index.js'

我的index.js（不完整）：

import React, { Component } from 'react';
import { AppRegistry, StyleSheet, Text, View, Button, Image, TextInput } 
from 'react-native';
import { StackNavigator } from 'react-navigation';

const RallyMobileNavigator = StackNavigator({
  Home: { screen: RallyMobile },
  LogIn: { screen: LogIn }
  },{
  initialRouteName: 'Home'
});

class RallyMobile extends Component {
  static navigationOptions = {
  title: 'Welcome',
  };
  state = {
  initialPosition: {},
  lastPosition: {},
  userData: [],
  }

render() {
  return (
    <View style={styles.container}>
      <View style={styles.header}>
        <Button
          onPress={() => navigate('LogIn')}
          title='Sign In'
        />
      </View>
      <View style={styles.EventListContainer}>
        <EventList
          location={this.state.lastPosition.location ?
          this.state.lastPosition.location : 
          this.state.initialPosition.location}
        />
      </View>
    </View>
    );
  };
};

class LogIn extends Component {
  state = {
    userName: '',
    password: ''
  }
   static navigationOptions = {
     title: 'Sign In',
   };
   logInUser = () => {
     console.log("test");
   }

   render() {
     return(
       <View>
       <View style={{padding: 10}}>
         <TextInput
           style={{height: 40}}
           placeholder="Username"
           onChangeText={(text) => this.setState({userName})}
         />
         <TextInput
            style={{height: 40}}
            placeholder="Password"
            onChangeText={(text) => this.setState({password})}
         />
        </View>
        <View>
          <button
            onPress={logInUser()}
            title='Sign In'
          />
        </View>
     </View>
     )
   }
 }

AppRegistry.registerComponent('RallyMobile', () => RallyMobileNavigator);

Answer 1

移动

const RallyMobileNavigator = StackNavigator({
  Home: { screen: RallyMobile },
  LogIn: { screen: LogIn }
  },{
  initialRouteName: 'Home'
});

到正上方

AppRegistry.registerComponent('RallyMobile', () => RallyMobileNavigator);

信用： https://github.com/react-community/react-navigation/issues/571#issuecomment-284207331