在反应本机中，纬度值无法从 String 转换为 Double

Question

我有 json

{
  "status": 200,
  "error": false,
  "driver": [
    {
      "id": "7",
      "name": "Kevin",
      "lat": "-6.2616031",
      "lon": "106.8424822"
    },
    {
      "id": "9",
      "name": "jhon",
      "lat": "-6.20032449",
      "lon": "106.6372306"
    },
}

在这里，当我显示出现错误问题时，我正在捕获或检索 json 数据并将其显示在地图上：

在反应本机中，纬度值无法从 String 转换为 Double

错误在哪里？这是我的代码

 componentDidMount() {
    fetch('https://example.com/myjson')
      .then(res => res.json())
      .then(data => {
        this.setState({ data: data.driver })
      })
      .catch(console.error)
   }

mapMarkers = () => {
        return this.state.data.map((driver) => <MapView.Marker
          key={driver.id}
          coordinate={{ "latitude": driver.lat, "longitude": driver.lon }}
          title={driver.name}
          description={driver.division}
        />)
      }

render() {
      return (
        <View style={styles.container}>
          <View style={{ flex: 2 }}>
            
            <MapView
            style={{ flex: 1, width: window.width }} //window pake Dimensions
            Region={{
                latitude: 106.8424822,
                longitude: -6.2616031,
                latitudeDelta: 70,
                longitudeDelta: 45
              }} >
            {this.mapMarkers()}
            </MapView>
          </View>
        </View>
      );
    }

Answer 1

JSON 中的纬度和经度数据的类型是字符串。当将纬度和经度传递给 Marker 组件的坐标属性时，您可能必须将它们转换为双精度。那么你可以试试这个吗？

coordinate={{ "latitude": parseFloat(driver.lat), "longitude": parseFloat(driver.lon) }}