在 setState 行上获取错误“无法读取未定义的属性 'setState'”答案

【问题标题】：Get Error 'Cannot read property 'setState' of undefined' on setState line在 setState 行上获取错误“无法读取未定义的属性 'setState'”
【发布时间】：2021-02-26 11:01:09
【问题描述】：

由于某种原因，我不断收到此错误，我不明白为什么，错误是

这是下面代码的相关位，我将两个对象作为道具传递给这个仪表板组件，一个是 firebase 用户对象，另一个是我用来从 firebase 检索一些数据的数据库对象，我检查了并且这两个对象已正确导入（如注释的控制台日志所示），但我不断收到此错误，我不知道为什么？

import React from 'react';


export default class Dashboard extends React.Component {
  constructor(props) {
    super(props);
    this.state = {dataArray: []};
  }

  async componentDidMount() {
    console.log("i am inside dashboard");
    //console.log(this.props.user);
    //console.log(this.props.database);

    let database = this.props.database;

    const docRef = database.collection("Some_Collection_here").doc("Some_Id_here")
    let dataRetrieved = null;

    docRef.get().then(function(doc) {
      if (doc.exists) {
        const dataRetrieved = doc.data();
        this.setState ({dataArray: dataRetrieved});
      } else {
        console.log("Error: no such document exists");
      }
    })
  }

  render() {
    return (
      <div>

      </div>
    );
  }
}

【问题讨论】：

您的 this 指针不是您在调用 setState 时所认为的那样。尝试将function(doc) { 替换为(doc) => {。箭头函数保留this 指针。
我确实尝试过 '(function = (doc) => { })' 但第一个等号带有红色下划线，所以我认为这是错误的语法
用我引用的另一个确切字符串替换我引用的确切字符串。

标签： javascript reactjs firebase google-cloud-firestore

【解决方案1】：

我明白你的问题。我觉得这样就OK了。

import React from 'react';


export default class Dashboard extends React.Component {
  constructor(props) {
    super(props);
    this.state = {dataArray: []};
  }

  async componentDidMount() {
    console.log("i am inside dashboard");
    //console.log(this.props.user);
    //console.log(this.props.database);

    let database = this.props.database;

    const docRef = database.collection("Some_Collection_here").doc("Some_Id_here")
    let dataRetrieved = null;

    docRef.get().then(doc => {
      if (doc.exists) {
        const dataRetrieved = doc.data();
        this.setState ({dataArray: dataRetrieved});
      } else {
        console.log("Error: no such document exists");
      }
    })
  }

  render() {
    return (
      <div>

      </div>
    );
  }
}

原因是：

此上下文
词法范围

【讨论】：