TypeError：无法读取未定义的属性“setState”（React 和 Firestore）答案

【问题标题】：TypeError: Cannot read property 'setState' of undefined (React & Firestore)TypeError：无法读取未定义的属性“setState”（React 和 Firestore）
【发布时间】：2021-03-16 13:07:53
【问题描述】：

我在使用 Firestore 将一些数据发送到状态时遇到问题。我正在尝试获取商店在我的课程中添加新问题时创建的自动生成的 ID。

这是我的一些代码块：

Editquestions.js

state = {
      question: '',
      questions: [],
      courseUrl: '',
      questionIds: [],
}
  
getData =() => {
      let db = firebase.firestore()
      let courseID = this.props.match.params.course;

       db.collection('courses').doc(courseID).collection('questions').get().then(function(querySnapshot){
            const questionIds = []
            querySnapshot.forEach(function(doc){
                const id = doc.id
                questionIds.push(id)
                console.log(questionIds)
            })
            this.setState({questionIds})
            console.log(this.state.questionIds)
        }).catch(error => {console.error(error)})
    }

我收到的错误是

TypeError: Cannot read property 'setState' of undefined

目前，我知道从 console.log 开始，ID 就会被提取：

console.log(questionIds)

工作正常，我只是无法将这些数据推送到状态。

【问题讨论】：

您发布的代码是否包含在组件中？能贴出完整的代码吗？
这可能会在组件中“工作”而不是在函数中，因为它没有“this”

标签： reactjs firebase google-cloud-firestore

【解决方案1】：

将您的函数语法更改为箭头语法以获取组件的 this 的隐式引用：

db.collection('courses').doc(courseID).collection('questions').get().then((querySnapshot) => {
            const questionIds = []
            querySnapshot.forEach(function(doc){
                const id = doc.id
                questionIds.push(id)
                console.log(questionIds)
            })
            this.setState({questionIds})
            console.log(this.state.questionIds)
        }).catch(error => {console.error(error)})

【讨论】：

【解决方案2】：

然后你的函数没有你的组件的this。将this 绑定到then 中的函数或使用箭头函数。

getData =() => {
      let db = firebase.firestore()
      let courseID = this.props.match.params.course;

       db.collection('courses').doc(courseID).collection('questions').get().then(function(querySnapshot){
            const questionIds = []
            querySnapshot.forEach(function(doc){
                const id = doc.id
                questionIds.push(id)
                console.log(questionIds)
            })
            this.setState({questionIds})
            console.log(this.state.questionIds)
        }.bind(this)).catch(error => {console.error(error)})
    }

或

getData =() => {
      let db = firebase.firestore()
      let courseID = this.props.match.params.course;

       db.collection('courses').doc(courseID).collection('questions').get().then((querySnapshot) => {
            const questionIds = []
            querySnapshot.forEach(function(doc){
                const id = doc.id
                questionIds.push(id)
                console.log(questionIds)
            })
            this.setState({questionIds})
            console.log(this.state.questionIds)
        }).catch(error => {console.error(error)})
    }

【讨论】：