TypeError: Невозможно прочитать свойство 'setState' со значением NULL, получая данные непосредственно из firebase rtdb

Question

Почему мое состояние не обновляется данными, которые я получаю напрямую из direbase

Где я получаю данные в консоли

Что я здесь не так делаю, Ошибка здесь

Answer 1

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

const db = firebase.database().ref('users/trainers/'+uid).on('value', function(snapshot){
   // here this refers to the firebase callback scope 
    this.setState({
        .........
        .........
    })
}))

Исправление, которое вы можете сделать, это

const that = this;
const db = firebase.database().ref('users/trainers/'+uid).on('value', function(snapshot){
    // now `that` holds your class LogPro1 scope, now you can setState using that.setState()
    that.setState({
        .........
        .........
    })
}))

Answer 2

Измените это:

const db = firebase.database().ref('users/trainers/'+uid).on('value', function(snapshot){
   // here this refers to the firebase callback scope 
    this.setState({
        .........
        .........
    })
}))

на это:

const db = firebase.database().ref('users/trainers/'+uid).on('value', (snapshot) =>{
   // here this refers to the firebase callback scope 
    this.setState({
        .........
        .........
    })
}))

Используйте функции стрелок:

Функция стрелки не имеет этой функции. Используется значение this лексической области видимости; Функции стрелок следуют нормальным правилам поиска переменных. Таким образом, при поиске этого, которого нет в текущей области видимости, функция со стрелкой заканчивает тем, что находила this из включенной области видимости.

Answer 3

Измените определение вашего метода getData (), как показано ниже:

getData = () => {
   ... As the above code
}

ИЛИ

свяжите это с методом getData в конструкторе.

constructor() {
   super(props);
   this.state = { email: '', firstName: '', lastName: '' }
   this.getData = this.getData.bind(this); // Binding this context to getData method
}