Question

我正在尝试使用'superagent'在我的Request中更改我的状态，但是console.log的结果是未定义的。大家能帮帮我吗？

componentDidMount(){

    var self = this;

    Request.get('https://api.navitia.io/v1/coverage/fr-idf/stop_areas/stop_area%3AOIF%3ASA%3A59491/departures?')
        .auth('******')
        .end(function(err, res){
            if(err){
                return err;
            }
            let departures = res.body.departures;
            self.setState({body: departures});
        });
    console.log(this.state.departures);
}

Answer 1

setState是usually asynchronous，但在某些情况下，它可以是同步的（如果在react上下文之外调用 - 例如，如果您将setState传递给非反应DOM节点/功能）。在这种情况下，它是异步设置的，与可能在同一个tick / frame中进行的其他状态更新进行批处理。如果您在this.state.departures或componentWillUpdate中记录componentDidUpdate（但仅在下一个刻度线上），您将在那里看到您的价值。即使您将控制台语句放入setTimeout(console.log(...), 100)，您也可能无法获得undefined。

或者，如果您需要对该值执行操作而不能或不想使用生命周期方法，则可以使用回调调用setState，如下所示：setState((state) => return mutatedState)。你永远不会在回调中收到陈旧状态，这样顺序调用setState将始终按预期运行。

Answer 2

两件事：

您未设置depatures州，但body州。
setState 可以是异步的，因此最好将日志记录放入其回调中。

试试这个：

componentDidMount() {
  const self = this;

  Request.get('https://api.navitia.io/v1/coverage/fr-idf/stop_areas/stop_area%3AOIF%3ASA%3A59491/departures?')
    .auth('******')
    .end(function(err, res){
      if(err) return err;
      let departures = res.body.departures;
      self.setState({ departures });
  }, () => console.log(this.state.departures));
}

更改Superagent请求的状态

2 个答案: