时间戳

首页 > 解决方案 > firebase.auth().onAuthStateChanged() 在本机反应中返回未定义

reactjs - firebase.auth().onAuthStateChanged() 在本机反应中返回未定义

问题描述

我试图在刷新应用程序并之前登录但firebase.auth().onAuthStateChanged()未定义后获取身份验证状态。这背后的动机是通过使用身份验证状态导航到主屏幕或登录屏幕。

import React, {Component} from 'react';
import {View} from 'react-native';
import firebase from 'firebase';
import {connect} from 'react-redux';
import {Spinner} from '../components/common';

class Switch extends Component {

  componentDidMount() {
    const userData = this.checkUser();
    this.switchContent(userData);
  }
  checkUser = () => {
    firebase.auth().onAuthStateChanged(async (userData) => {
      return userData;
    });
  };
  switchContent(userData) {
    console.log(userData);
    if (userData) {
      return this.props.persistantSignIn();
    }
    return this.props.navigation.push('SignInForm');
  }
  renderComponent() {
    return (
      <View style={{flex: 1}}>
        <Spinner />
      </View>
  }
  render() {
    return <View style={{flex:1}}>{this.renderComponent()}</View>;
  }
}

export default connect(null, {persistantSignIn})(Switch);

标签： reactjsfirebasereact-nativefirebase-authentication

解决方案

onAuthStateChanged(ie )的结果userData应该在匿名函数中处理。另请注意，在用户登录之前，userData将是null.

  componentDidMount() {
    firebase.auth().onAuthStateChanged( (userData) => {
      this.switchContent(userData);
    });
  }

没有必要firebase.auth().onAuthStateChanged在匿名函数中进行包装，除非，例如，您要使用useEffect，如下所示：

import { useEffect } from 'react';

...
  useEffect(() => {
    auth.onAuthStateChanged( userData => {
      this.switchContent(userData);
    })
  },[])

推荐阅读