componentDidMount 内的 setState [重复]

Posted 2023-03-14

【中文标题】componentDidMount 内的 setState [重复]

【英文标题】：setState inside componentDidMount [duplicate]

【发布时间】：2019-12-17 19:12:35

【问题描述】：

我正在尝试等待 componentDidMount 中的数据，然后将我的状态 isLoading 更改为 false，但 setState 没有触发。我可以控制台记录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>
      )
     
  

【参考方案1】：

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

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

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