componentDidMount内部的setState [重复]

Question

此问题已经在这里有了答案：

How to access the correct `this` inside a callback?（10个答案）

[<11天前关闭。

我正在尝试等待componentDidMount中的数据，然后将我的状态isLoading更改为false，但是setState没有触发。我可以console.log branch.init中的数据，但是我不知道为什么setState无法正常工作。

    state = {
      isLoading: true,
    }

    componentDidMount() {
      console.log("componentDidMount");

      let branchKeyTest = 'key_test_aBcDeF'

      branch.init(branchKeyTest, function(err, data) {
        console.log(JSON.stringify(data, null, 1))

        this.setState({ isLoading: false })

        if (data && data.data_parsed) {
          switch (data.data_parsed.link_type) {
            case 'new_release':
              localStorage.setItem('redirect', JSON.stringify({
                'link_type': 'new_release',
                'release_id': data.data_parsed.release_id
              }));
              break;
            default:
              console.log("do nothing")
          }
        }
      })
    }


  render() {
    const { isLoading } = this.state;
    if (!isLoading) {
      return (
        <div>Done Loading</div>
      )
    else {
      return (
        <div>Still Loading</div>
      )
    } 
  }

Answer 1

branch.init(branchKeyTest, function(err, data) {需要更改为branch.init(branchKeyTest, (err, data) => {，因为您无权访问匿名函数中类的this关键字。

您编写它的方式，您无权访问this，因为this指的是函数的上下文-而不是类。通过将其更改为粗箭头语法，您可以访问this作为React类的上下文。

您可以阅读有关this here的更多信息。