Javascript 反应变量不更新

我一直在尝试使用谷歌地图API计算几个地方之间的总旅行时间。但是当尝试使用上述信息访问变量total_duration时，控制台上不会显示任何内容

const responses = [];
    let total_duration = 0;
    for(let i = 0 ; i < origins.length ; i++){
      const matrix = new google.maps.DistanceMatrixService();
      matrix.getDistanceMatrix({
        origins: origins[i],
        destinations: destinations[i],
        travelMode: google.maps.TravelMode.DRIVING,
      }, 
      function(response, status){
        responses.push(response);
      });
    }
    console.log(responses);
    for(let i = 0 ; i < responses.length ; i++){
      total_duration += responses[i].rows[0].elements[0].duration.value;
      console.log(responses[i])
    }
    console.log(total_duration);

但是其他控制台日志没有显示我需要的信息。你能帮我解决这个错误吗？先谢谢你

现在，当我尝试在getTimes函数中更新状态时，我的状态不会更新。时间总是零

---

请您试试console.logtotal_duration；inside for loopI仍然不显示任何内容，也不显示未定义的内容，也不显示空行或zero.matrix.getDistanceMatrix不返回承诺，因此等待，而不是实际等待回调完成-请参见，仍然不显示任何内容。我已经编辑了我的问题.console.logresponses[I]这显示了什么您可以尝试一下吗，如果它有效，请使用state变量作为origins.length的总持续时间。非常感谢，它显示了时间，但当我从控制台注销时，它不会显示任何内容。我将其设置为将total_duration保持在状态，但它告诉我this.setState未定义。这是react，你调用的函数是什么，你是在构造函数中绑定它还是使用了arrow函数？我已使用arrow函数进行了测试，但状态未更新。你能放置整个js文件组件吗

[
  {
    "rows": [
      {
        "elements": [
          {
            "distance": {
              "text": "1.2 km",
              "value": 1161
            },
            "duration": {
              "text": "3 mins",
              "value": 169
            },
            "status": "OK"
          }
        ]
      }
    ],
    "originAddresses": [
      "3670 SW 3rd St, Miami, FL 33135, USA"
    ],
    "destinationAddresses": [
      "3911 SW 2nd Terrace, Coral Gables, FL 33134, USA"
    ]
  },
  {
    "rows": [
      {
        "elements": [
          {
            "distance": {
              "text": "1.5 km",
              "value": 1473
            },
            "duration": {
              "text": "4 mins",
              "value": 226
            },
            "status": "OK"
          }
        ]
      }
    ],
    "originAddresses": [
      "3911 SW 2nd Terrace, Coral Gables, FL 33134, USA"
    ],
    "destinationAddresses": [
      "4490 SW 5th Terrace, Coral Gables, FL 33134, USA"
    ]
  }
]

import React, {Component} from 'react';

class HomePage extends Component {

  constructor(props) {
    super(props);

    this.state = {
      time: 0,
      places: [
        {latitude: some_data, longitude: some_data},
        {latitude: some_data, longitude: some_data}
      ]
    };
  }

  componentDidMount(){}

  getTimes = () => {
    const origins = [], destinations = [];
    for(let i = 0 ; i < this.state.places.length - 1 ; i++){
      origins.push([new google.maps.LatLng(this.state.places[i].latitude, 
        this.state.places[i].longitude)]);
      destinations.push([new google.maps.LatLng(this.state.places[i + 1].latitude, 
        this.state.places[i + 1].longitude)]);  
    }
    let total_duration = 0;
    for(let i = 0 ; i < origins.length ; i++){
      const matrix = new google.maps.DistanceMatrixService();
      matrix.getDistanceMatrix({
        origins: origins[i],
        destinations: destinations[i],
        travelMode: google.maps.TravelMode.DRIVING,
      }, 
      (response, status) => {
        total_duration += response.rows[0].elements[0].duration.value;
        console.log(total_duration);
        this.setState({time: total_duration});
      });
    }
    console.log(this.state.time);    
  }

  render() {
    const {time} = this.state;
    return (
      <h1>{time}</h1>
    );
  }
}

 this.setState(state => {
  const newTime = state.time + total_duration
  return { count: newTime }
}, () => {
  console.log(this.state.time);  
})