Native Firebase Authentication Error

Question

Ich versuche, das Login-Benutzerkonto System zu erstellen und aus irgendeinem Grund erkennt es falsche Kennwörter nach dem Navigieren zum Startbildschirm statt zuvor. (Der Code, auf den ich mich beziehe, ist die login() Funktion). Ich setze Konsolen-Log-Anweisungen, um dies zu bestimmen und 'console.log (errorCode);' ist das letzte, was ausgegeben wird. Kann jemand bitte die Logik des Codes erklären, den ich geschrieben habe und warum falsche Passwörter nur am Ende erkannt werden? Die Reihenfolge der Ausgabe der Konsole ist „Anmelden“ „zum Haupt Navigieren“ „Login finish“ „Auth/falsch-Passwort? Vielen Dank.

import React, {Component} from 'react'; 
import { 
    View, 
    Text, 
    TouchableHighlight, 
    TouchableOpacity, 
    TextInput, 
    KeyboardAvoidingView 
} from 'react-native'; 
import Input from './Input'; 
import Icon from 'react-native-vector-icons/MaterialIcons'; 
import {firebaseApp} from './App'; 
import {Tabs} from './Router'; 
import {StackNavigator, TabNavigator} from 'react-navigation'; 
import { Root } from './Router'; 

export default class LoginScreen extends Component { 
    constructor(props) { 
    super(props) 

    this.state = { 
     email: '', 
     password: '', 
     status: '', 
     success: '' 
    } 

    this.login = this.login.bind(this); 

    } 

    login(){ 
    console.log("Logging in"); 
    var errorCode; 
    var errorMessage; 
    firebaseApp.auth().signInWithEmailAndPassword(this.state.email, this.state.password).catch(function(error) { 
     errorCode = error.code; 
     console.log(errorCode); 
     errorMessage = error.message; 
    }); 

     if (errorCode === 'auth/wrong-password') { 
     console.log("Wrong password"); 
     alert('Wrong password.'); 
     } else { 
     console.log("Navigate to Home"); 
     this.props.navigation.navigate('Home'); 
     } 

     //console.log(error); 
     console.log("Login finish"); 


    /*firebaseApp.auth().signInWithEmailAndPassword(this.state.email, this.state.password).catch(function(error) { 
     console.log(error.code); 
     console.log(error.message); 
    }) 

    this.props.navigation.navigate('Home'); 

    console.log("Navigate to Home");*/ 
    } 

    render() { 
    var styles = require('./Styles'); 
    const {navigate} = this.props.navigation; 

    return(
     <KeyboardAvoidingView behavior='padding' style={styles.loginContainer}> 
     <Text style={styles.loginHeader}>PRINCETON EVENTS</Text> 
     <TextInput 
      style={styles.loginInput} 
      placeholder="Email" 
      autoCapitalize='none' 
      onChangeText={(text) => this.setState({email: text})} 
      value={this.state.email} 
      returnKeyType='next'/> 
     <TextInput 
      secureTextEntry 
      style={styles.loginInput} placeholder="Password" 
      onChangeText={(text) => this.setState({password: text})} 
      value={this.state.password} 
      autoCapitalize='none' 
      returnKeyType='go'/> 
     <TouchableOpacity style={styles.loginButton}> 
      <Text style={styles.loginText} onPress={this.login}>LOGIN</Text> 
     </TouchableOpacity> 
     <TouchableOpacity 
      style={styles.loginButton} 
      onPress = {() => navigate('CreateAccount')}> 
      <Text style={styles.loginText}> CREATE ACCOUNT </Text> 
     </TouchableOpacity> 
     </KeyboardAvoidingView> 
    ); 

} 
} 

Answer 1

Sie benötigen Erfolgs-/Fehlerfälle behandeln in dann und fangen Sie Blöcke

firebaseApp.auth().signInWithEmailAndPassword(this.state.email, this.state.password) 
.then(function() { //Auth is successful 
    this.props.navigation.navigate('Home'); 
} 
.catch(function(error) { 
    errorCode = error.code; 
    errorMessage = error.message; 
    if (errorCode === 'auth/wrong-password') { 
    console.log("Wrong password"); 
    alert('Wrong password.'); 
    } else { 
    console.log("Navigate to Home"); 
    this.props.navigation.navigate('Home'); 
    } 
});