状态设置太晚，无法在地图上生成图钉

问题描述

在我的本机应用程序中，我有一个包含地图的屏幕。引脚的数据来自API。

我收到了所有必要的数据，但是这种情况为时已晚。当我记录this.state.markers时，它总是空的，除了在getStores方法中。

地图如何等待API响应？

interface Props {
}

interface State {
  markers: any;
}

export default class MapShops extends Component<Props,State> {
  constructor(props) {
    super(props);

    this.state = {
      markers: []
    }
    this.getStores();
  }

  getStores = () => {
    Axios({
        "method": "GET","url": "https://xxx","headers": {
          "content-type": "application/json",'Authorization': 'xxx'
        }
      })
      .then((response) => {
        this.state = {
          markers: response
        }
      })
      .catch((error) => {
        console.log(error)
      })
  };

  mapMarkers = () => {
    return this.state.markers.map((report) => <Marker key={report.id}
      coordinate = {
        {
          latitude: report.address.latitude,longitude: report.address.longitude
        }
      }
      title={report.brandName}>
    </Marker>);
  }

  render() {
    if (this.state.markers) {
      return (<MapView style = {
        {
          flex: 1
        }
      }>
        {this.mapMarkers()}
      </MapView>
      );
    }
  }
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）