Как получить доступ к переменной состояния в componentDidMount в реагировать

Question

«TypeError: Невозможно прочитать свойство 'state' of null", это сообщение об ошибке выше, вот что я получаю .... следующий мой код

constructor(props) {
  super(props)
  this.state = {
    desc: '',
  }
}

componentDidMount = () => {
  var ref = fire.database().ref("Employers/Employer1");
  ref.orderByKey().on("child_added", function(snapshot) {

    this.setState({
      desc: snapshot.val()
    })
    console.log('====================================');
    console.log(this.state.desc);
    console.log(snapshot.val().Description);
    console.log('====================================');
  });

  // snapshot.val() is the dictionary with all your keys/values from the '/store' path


}

Answer 1

componentDidMount - это хук жизненного цикла, он не должен быть функцией стрелки.

изменить

componentDidMount = () => {
}

К

componentDidMount(){
}

Answer 2

Это из-за поведения this в javascript. Есть два способа решить это. Сначала используйте функцию стрелки, измените третью строку на

ref.orderByKey().on("child_added", (snapshot) => {

Другой способ - присвоить это значение другой переменной и использовать состояние с помощью этой переменной. Forexample

const self = this;
ref.orderByKey().on("child_added", function(snapshot) {

    this.setState({ desc: snapshot.val() })
    console.log('====================================');
    console.log(self.state.desc);
    console.log(snapshot.val().Description);
    console.log('====================================');
});

Для понимания this Вы можете прочитать эту статью