Javascript Can'；t从componentDidMount调用函数

在componentDidMount（）内部，我正在检查firebase.auth以查看用户是否已通过身份验证，如果是，则应调用多个函数（“this.functionName（）”），但这不起作用，并导致出现黄色框：“[未经处理的承诺拒绝：TypeError:undefined不是对象（评估'this.loadChallenge'）”它们位于同一类之下

componentDidMount() {
        firebase.auth().onAuthStateChanged(function(user) {

      //if user exists
      if (user) {
        console.log('Auth triggered.')
        this.loadChallenge()
        this.activateListener(user.uid)

        console.log('User is logged in ... profile.')
      } else {
        console.log('Not signed in.')
      }
    });
  }

使用“arrow function”语法而不是function关键字为回调函数保留

this

的值。因此，函数可以访问组件类上的方法

使用“arrow function”语法而不是function关键字为回调函数保留

this

的值。因此，函数可以访问组件类上的方法

---

我创建了一个新的arrow函数，这个函数从普通函数中调用，然后调用另外两个函数，这样做就不那么优雅了，但这绝对是正确的选择！您也可以使用

.bind（）

来传递

这个

在我大部分时间使用react时，我都在避免使用函数，因此不必学习其中的大部分内容。我以前用bind做过一些其他的东西，但是箭头函数肯定会让这个方法更清晰。我创建了一个新的箭头函数，这个函数在普通函数中调用，然后调用其他两个函数，这样做就不那么优雅了，但这绝对是一个好办法！您也可以使用

.bind（）

来传递

这个

在我大部分时间使用react时，我都在避免使用函数，因此不必学习其中的大部分内容。我以前用bind做过其他的东西，但箭头函数肯定会让这种方式更清晰

componentDidMount() {
    firebase.auth().onAuthStateChanged(user => {

        //if user exists
        if (user) {
            console.log('Auth triggered.')
            this.loadChallenge()
            this.activateListener(user.uid)

            console.log('User is logged in ... profile.')
        } else {
            console.log('Not signed in.')
        }
    });
}