从同一JS文件导入屏幕

时间:2017-05-23 17:39:12

标签: react-native-android react-navigation

我已经在StackOverflow中查询了有关此问题的所有问题但没有成功。我不断得到以下错误:路线' Home'应该宣布一个屏幕。 Android Emulator Error

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

我的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);

1 个答案:

答案 0 :(得分:1)

移动

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

就在

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

信用: env docs