Question

“ TypeError：无法读取null的属性'state'” 上面的错误信息是我得到的... 以下是我的代码

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

这是因为javascript中的this行为。有两种解决方法。首先使用箭头功能，将第三行更改为

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

另一种方法是将此值分配给另一个变量，并通过使用该变量来使用状态。例如

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，您可以阅读此article

Answer 2

componentDidMount 是生命周期挂钩，它不一定是箭头功能。

更改

componentDidMount = () => {
}

收件人

componentDidMount(){
}

如何在reactjs中的componentDidMount中访问状态变量

2 个答案: