Typeerror: невозможно прочитать свойство uid со значением null

Я пытаюсь войти в систему с помощью номера телефона в своем приложении с помощью firebase, но у меня возникла проблема с процессом входа в систему. Я не могу войти в систему с помощью номера телефона в firebase, но если я зарегистрируюсь с номером телефона и перенаправляюсь на домашнюю страницу, он работает правильно. Я использую тот же метод для входа в систему, но у меня такая же проблема, как TypeError: Cannot read property 'uid' of null, но я успешно получаю все значения консоли. Я не знаю, в чем здесь проблема. Но эта ошибка повторяется 3 раза,

Вот мой код:

    renderLoginButton() {
        if (this.props.loading) {
          return (
            <Spinner size="large" />
          );
        }

        return (
          <Button
          style={{ alignSelf: 'flex-start' }}
            onPress={this.onLoginBtnClicked.bind(this)}
          >
            Login
          </Button>
        );
      }

onLoginBtnClicked () {

    const { contact, password } = this.props;
    const error =  Validator('password', password) ||  Validator('contact', contact);

    if (error !== null) {
      Alert.alert(error);
    } else {
          console.log('else');
        // this.props.loginUser({ contact, password});

        const mobileNo = '+91'+contact;
        firebase.auth().signInWithPhoneNumber(mobileNo)
        .then(confirmResult =>
            console.log(confirmResult),
            curr = firebase.auth(),
            console.log("curr"+JSON.stringify(curr)),
            this.setState({ data: curr}),
            NavigationService.navigate('Home')
        )
        .catch(error => console(error.message) );
    }

}

CustomDrawerComponent.js

    import React, { Component } from 'react';
import { View, Image, Text } from 'react-native';
import { DrawerItems } from 'react-navigation';
import { connect } from 'react-redux';

import { fetchUserDetails } from '../actions';

class CustomDrawerContentComponent extends Component {

  state = {
    uri: '',
    isfailed: ''
  }

  componentWillMount() {
    this.props.fetchUserDetails();
  }

  componentWillReceiveProps(nextProps) {
    let uri = '';
    if (nextProps.ProfilePic !== '') {
      uri = nextProps.ProfilePic;
      this.setState({ uri, isfailed: false });
    } else {
      uri = '../images/ic_person_24px.png';
      this.setState({ uri, isfailed: true });
    }

    this.setState({ uri });
  }

  renderProfileImage() {
    if (!this.state.isfailed) {
      return (
        <Image
          style={styles.profileImageStyle}
          source={{ uri: (this.state.uri) }}
        />
      );
    }
    return (
      <Image
        style={styles.profileImageStyle}
        source={require('../images/ic_person_24px.png')}
      />
    );
  }

  render() {
    console.log('Profile Pic :: ', this.props.ProfilePic);
    return (
      <View style={styles.container}>
        {this.renderProfileImage()}
        <Text style={styles.textStyle}>
          {this.props.name} - {this.props.category}
        </Text>
        <DrawerItems {...this.props} />
      </View>
    );
  }
}

const styles = {
  container: {
    flex: 1,
    paddingLeft: 10
  },
  textStyle: {
    fontSize: 14,
    textAlign: 'left',
    color: '#000000'
  },
  profileImageStyle: {
    alignSelf: 'flex-start',
    marginTop: 16,
    padding: 10,
    width: 40,
    height: 40,
    borderRadius: 75
  }
};

const mapStateToProps = state => {
  const { userprofile } = state;
  return userprofile;
};

export default connect(mapStateToProps, { fetchUserDetails })(CustomDrawerContentComponent);

стек вызовов:

enter image description hereenter image description here

Вам необходимо опубликовать код для CustomDrawerComponent, где вы используете uid или образец кодовой базы для воспроизведения проблемы.

Pritish Vaidya 12.09.2018 11:43

код обновлен, пожалуйста, проверьте и нарисуйте меня на выпуск

Mahi Parmar 12.09.2018 11:47

uid, похоже, здесь не присутствует, не могли бы вы поделиться образцом кодовой базы, чтобы воспроизвести проблему для тщательной проверки, возможно ли это?

Pritish Vaidya 12.09.2018 11:50

да, именно поэтому мне интересно, почему возникает эта ошибка

Mahi Parmar 12.09.2018 11:53
7
4
9 371
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Почему user возвращается как undefined (или даже null)?

Вы знаете, что есть вошедший пользователь, вы только что вошли в систему, черт возьми, вы даже можете увидеть объект пользователя в инструментах Chrome dev.

Тогда почему он все еще возвращается undefined? На это есть прямой ответ.

Вы получаете пользовательский объект ДО, который готов к использованию.

Это может произойти по нескольким причинам, но если вы будете следовать этим двум «правилам», вы больше не увидите эту ошибку.

Правило №1: вытащите его из constructor()

Когда у вас есть что-то вроде:

constructor(){
  this.userId = firebase.auth().currentUser.uid
}

Более половины времени загрузки страницы конструктор будет пытаться получить пользователя до того, как пользователь будет готов, приложение блокирует его, потому что страница загружена не полностью, поэтому вы будете пытаться получить доступ к uid собственности, которой просто еще нет.

Когда ваша страница будет полностью загружена, вы можете вызвать, чтобы получить currentUser.uid.

Правило # 2: сделайте его наблюдаемым

Вы можете воспользоваться другим подходом, который мы только что сделали в предыдущем вызове Firebase: firebase.auth (). CurrentUser является синхронным. Мы можем сделать его асинхронным, вместо этого подписавшись на наблюдаемый auth.

/**
   * When the App component mounts, we listen for any authentication
   * state changes in Firebase.
   * Once subscribed, the 'user' parameter will either be null 
   * (logged out) or an Object (logged in)
   */
  componentDidMount() {
    this.authSubscription = firebase.auth().onAuthStateChanged((user) => {
      this.setState({
        loading: false,
        user,
      });
    });
  }
  /**
   * Don't forget to stop listening for authentication state changes
   * when the component unmounts.
   */
  componentWillUnmount() {
    this.authSubscription();
  }
  render() {
    // The application is initialising
    if (this.state.loading) return null;
    // The user is an Object, so they're logged in
    if (this.state.user) return <LoggedIn />;
    // The user is null, so they're logged out
    return <LoggedOut />;
  }
}

Исходная статья: Почему Firebase возвращает undefined при получении uid?

Хорошее руководство по React Native будет здесь: Начало работы с аутентификацией Firebase на React Native Поскольку ваш код не отображал много информации, я надеюсь, что вы обновите свой вопрос, чтобы показать больше кода, чтобы я мог его просмотреть.

Большое спасибо за ответ, но я уже пробовал это решение, которое у меня не работает, и поскольку у меня есть ограничение на загрузку кода в этом сообществе, я не могу показать здесь весь код

Mahi Parmar 12.09.2018 12:40

@MahiParmar или можете найти здесь medium.com/react-native-training/…

Angus Tay 12.09.2018 14:50

Еще раз спасибо за обмен знаниями, но мое единственное требование - войти только с номером телефона, а не по электронной почте.

Mahi Parmar 12.09.2018 14:52

Я знаю, но ваша основная проблема в том, что ваш код не получает информацию об аутентификации, что, вероятно, связано с загрузкой вашего приложения в другое событие до того, как вы получили аутентификацию. Следовательно, вам нужно только настроить стиль кода. :)

Angus Tay 12.09.2018 14:56

Теперь ваш сценарий похож на то, что вы садитесь в автобус (ваше приложение), вы заплатили за билет на автобус в терминале (входя в систему), но вы забыли получить билет на стойке (не получили ответа от авторизации) и сразу же садитесь в автобус (следующее действие / событие после входа в систему). После того, как вы встали в автобус, водитель автобуса просит ваш билет, и вы понимаете, что у вас нет билета с собой (uid = null).

Angus Tay 12.09.2018 15:01

Другие вопросы по теме