Question

未捕获（在承诺中）TypeError：无法读取未定义的属性（读取“setState”）

2022-03-26

19506

javascript reactjs

我收到此错误：

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'setState')

这是我的代码：

class Table extends Component {
    constructor (props) {
        super(props);
        this.state = {
            employees: [],
        }
    }
    componentDidMount() {
        this.getEmployeeList();
    }
    getEmployeeList = () => {
        axios.get("employee/list")
        .then(function(response) {

            this.setState({
                employees: response.data,
            });

        });
        console.log(this.state.employees)
    }
     
    // Remaining codes
    
}

Answer 1

在这里，您将一个匿名函数传递给 axios.then 回调。

axios.get("employee/list")
.then(function(response) {

    this.setState({
        employees: response.data,
    });

});

此函数有自己的 this ，但没有 setState 属性。要解决此问题，您必须像这样绑定 this ：

axios.then(
  function (response) {
    this.setState({
      employees: response.data
    });
  }.bind(this)
);

或者使用箭头函数，它将自动绑定外部 this

axios.then(
 (response) =>{

    this.setState({
      employees: response.data
    });
  }
);

Answer 2

这是因为您传入的回调是一个 函数表达式 ，它有自己的 this 绑定。

要解决此错误，您可以：

使用 箭头函数 ：

getEmployeeList = () => {
  axios
    .get("employee/list")
    .then((response) => {
      this.setState({
        employees: response.data,
      });
    });
};

将 this 保存到 self 变量，然后调用它：

getEmployeeList = () => {
  const self = this;
  axios
    .get("employee/list")
    .then(function (response) {
      self.setState({
        employees: response.data,
      });
    });
};

Answer 3

请重新检查您的拼写。大多数 typeError 问题都是由于拼写错误造成的

Arnold Omondi

2022-10-08