在屏幕之间导航时,我需要一些帮助

时间:2019-05-12 19:48:17

标签: react-native react-navigation

我不知道为什么我不能导入我的屏幕,或者我只是找不到我的错误。我有另一个这样的屏幕。导入和堆栈导航器屏幕类似于此处,但那里没有错误。

这是我的代码:

import React, {Component} from 'react';
import * as firebase from 'firebase';
import {Container, Content, Header, Text, Form, Input, Item, Button} from 'native-base';
import Icon from 'react-native-vector-icons/Ionicons';
import {createAppContainer, createStackNavigator} from 'react-navigation';
import {StyleSheet, ImageBackground, Dimensions, Image, View} from 'react-native';
import MainNavigator from './LoginScreen';

// Some Code

const MainNavigator1 = createStackNavigator({
    SignUp: {
        screen: SignUpScreen,
        navigationOptions: {
            header: null,
        }
    },
    Login: {
        screen: MainNavigator,
        navigationOptions: {
            header: null,
        }
    }
})

export default createAppContainer(MainNavigator1);

const styles = StyleSheet.create ({
  container:{
    flex: 1,
    backgroundColor: null,
    justifyContent: 'center',
    padding: 10
  },
  profileImg: {
    height: 80,
    width: 80,
    overflow: 'hidden',
  }
}) 

LogInScreen:

import React, {Component} from 'react';
import * as firebase from 'firebase';
import {Container, Content, Header, Text, Form, Input, Item, Button} from 'native-base';
import Icon from 'react-native-vector-icons/Ionicons';
import {createAppContainer, createStackNavigator} from 'react-navigation';
import {StyleSheet, ImageBackground, Dimensions, Image, View} from 'react-native';
import AppContainer22 from './DrawerNavigatorNew';
import MainNavigator1 from './SignUpScreen';

const firebaseConfig = {
  apiKey: 
  authDomain: 
  databaseURL: 
  projectId: 
  storageBucket: 
};

firebase.initializeApp(firebaseConfig);


class LoginScreen extends React.Component {

  constructor (props) {
    super(props)

    this.state =({
      email:'',
      password:'',
      error:'',
    })
  }
/*
  signUpUser = (email, password) => {
    try {

      if(this.state.password.length <6)
      {
        alert("Please enter atleast 6 characters")
        return;
      }

      firebase.auth().createUserWithEmailAndPassword(email, password)
    }

    catch (error){
      console.log(error.toString())
    }
  }
*/
onSignInPress() {
    this.setState({error:''})
    const {email, password} = this.state;

    firebase.auth().signInWithEmailAndPassword(email, password)
    .then(() => {
        this.setState({error:''})
        this.props.navigation.navigate('Drawer');
    })
    .catch(() => {
        this.setState({error:'Authentication failed'})
    })
}

  render(){
    let { height, width } = Dimensions.get('window');
    return (
        <ImageBackground source={{uri:'https://guidetoiceland.is/image/437199/x/0/northern-lights-in-all-the-colors-of-the-rainbow-dance-across-the-sky-in-iceland-6.jpg'}}
        style={{height, width}}>
      <Container style={styles.container}>

      <View style={{justifyContent:'center', alignItems:'center'}}>
      <Image source={{uri:'https://image.flaticon.com/icons/png/512/10/10155.png'}}
             style={styles.profileImg}/>
        </View>

        <Form>
        <Item rounded>
            <Icon active name='md-mail' size={20} color={'white'}/>
            <Input
              name='email'
              placeholder='YourEmail@gmail.com'
              autoCorrect={false}
              autoCapitalize='none'
              onChangeText={(email)=> this.setState({email})} 
              keyboardType='email-address'
              style={{marginTop: 10}}
              />
        </Item>

        <Item rounded>
            <Icon active name='md-key' size={25} color={'white'}/>
            <Input
              name='password'
              placeholder='******'
              secureTextEntry={true}
              autoCorrect={false}
              autoCapitalize='none'
              onChangeText={(password)=> this.setState({password})}
              style={{marginTop: 10}}
              />
          </Item>
            <Text style={{color: 'red'}}>{this.state.error}</Text>
          <Button style={{marginTop: 10}}
          full
          rounded
          success
          onPress = {this.onSignInPress.bind(this)}
          >
            <Text> Login </Text>
          </Button>

          <Button style={{marginTop: 10}}
          full
          rounded
          primary
          onPress = {this.props.navigation.navigate('SignUp')}
          >
            <Text style={{color: 'white' }}> Sign Up </Text>
          </Button>
        </Form>
      </Container>
      </ImageBackground>
    );
  }
}

const MainNavigator = createStackNavigator({
    Home: {
        screen: LoginScreen,
        navigationOptions: {
            header: null,
        }
    },
    Drawer: {
        screen: AppContainer22,
        navigationOptions: {
            header: null,
        }
    },
    SignUp: {
        screen: MainNavigator1,
        navigationOptions: {
            header: null,
        }
    }
  });

  export default createAppContainer(MainNavigator);


const styles = StyleSheet.create ({
  container:{
    flex: 1,
    backgroundColor: null,
    justifyContent: 'center',
    padding: 10
  },
  profileImg: {
    height: 80,
    width: 80,
    overflow: 'hidden',
  }
}) 

这是错误:

enter image description here

0 个答案:

没有答案