如何在React状态中存储Google Maps回调函数返回值？

老哥，你的问题主要出在异步回调的作用域和this指向上，我来给你捋清楚并修正代码：

问题分析 #

1. 作用域问题：你在toGeoJson的普通回调里return obj根本没用，而且外部的this.setState({ value: obj })里的obj是未定义的——因为obj是回调函数的局部变量，只有在回调内部才能访问到它。
2. this指向问题：普通函数作为回调时，this的指向会脱离组件实例，直接在里面调用this.setState会报错。
3. 异步特性：toGeoJson是异步方法，不会同步返回结果，必须在回调内部处理返回的obj。

修正后的代码 #

直接在回调内部调用setState，同时用箭头函数保持this指向组件实例：

getGeoJson = (map, maps) => {
  // 用箭头函数作为回调，确保this指向组件实例
  map.data.toGeoJson((obj) => {
    // 直接在回调内部把obj存入状态
    this.setState({ value: obj }, () => {
      // 可选：如果需要在状态更新完成后做操作，比如打印验证
      console.log("GeoJSON已成功存入状态：", this.state.value);
    });
  });
};

额外说明 #

如果你的组件是Class组件，还可以通过以下方式确保this绑定正确：

• 要么在constructor里绑定方法：

constructor(props) {
  super(props);
  this.state = { value: null };
  this.getGeoJson = this.getGeoJson.bind(this);
}

• 要么直接用箭头函数定义类方法（就是上面示例里的写法），这种方式更简洁。

另外要注意，setState本身也是异步的，如果需要基于更新后的状态做后续操作，一定要放在setState的第二个回调参数里，不要直接在setState后面写逻辑哦。

内容的提问来源于stack exchange，提问作者Wisdom1