Redirect to "Home" screen after login validation - React Native + Firebase

Asked

Viewed 2,621 times

0

I need to implement in the code below the command so that the user is validated is redirected to the screen "Home". The changes I’ve made haven’t solved my problem. I can create the user, save in Firebase but when I log in I can’t direct to "Home" screen.

import React, { Component } from 'react';
import PropTypes from 'prop-types';
import {
  KeyboardAvoidingView,
  StyleSheet,
  ImageBackground,
} from 'react-native';
import Login from './screens/Login';
import Register from './screens/Register';
import ForgotPassword from './screens/ForgotPassword';
import { w } from './api/Dimensions';
import Home from './screens/Home';

export default class FirebaseLogin extends Component {
  state = {
    currentScreen: 'login', // can be: 'login' or 'register' or 'forgot'
  };

  changeScreen = screenName  => () => {
    this.setState({ currentScreen: screenName  });
  };

  userSuccessfullyLoggedIn = user => {
    this.props.login(user);
  };

  render() {
    let screenToShow;

    switch (this.state.currentScreen) {
      case 'login':
        screenToShow = (
          <Login
            change={this.changeScreen}
            success={this.userSuccessfullyLoggedIn}
          />
        );
        break;
      case 'register':
        screenToShow = <Register change={this.changeScreen} />;
        break;
      case 'forgot':
        screenToShow = <ForgotPassword change={this.changeScreen} />;
        break;
    }

    return (
      <KeyboardAvoidingView
        behavior="position"
        keyboardVerticalOffset={-w(40)}
        style={styles.container}>
        <ImageBackground
          source={this.props.background}
          style={styles.background}
          resizeMode="stretch">
          {screenToShow}
        </ImageBackground>
      </KeyboardAvoidingView>
    );
  }
}

FirebaseLogin.propTypes = {
  login: PropTypes.func.isRequired,
};

FirebaseLogin.defaultProps = {
  background: null,
};

2 answers

1


Try this, as you can see it keeps watching if any user authenticated, and then redirects it. That was his question?

componentDidMount() {
firebase.auth().onAuthStateChanged(user => {
  if (user != null) {
    this.props.navigation.navigate('Home')
  }
})

}

0

Next to the Login function of the 'Login' button I pass the onAuthStateChanged.

firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
    // Redirecionamento de tela.
  }
});

Browser other questions tagged

You are not signed in. Login or sign up in order to post.