在react-native-maps中渲染多個標記

Question

Hye，Im新的反應本地化並想問我如何在地圖中渲染多個標記。

這是我的代碼

內部類： -

constructor(props) { 
super(props); 

    this.state = { 
    coordinate: ([{ 
    latitude: 3.148561, 
    longitude: 101.652778, 
    title: 'hello' 
    }, 
    { 
    latitude: 3.149771, 
    longitude: 101.655449, 
    title: 'hello' 
    } 
    ]), 
}; 

}

內呈現： -

<MapView 
     style={styles.map} 
     showsUserLocation={true} 
     followUserLocation={true} 
     zoomEnabled={true} 
     //annotations={markers} 
     > 
      <MapView.Marker 
       coordinate={this.state.coordinate} 
       title={this.state.coordinate.title} 
      /> 
     </MapView> 

我想渲染裏面的地圖和我這兩個標記不知道如何在原生反應中做出循環來渲染它。我已經嘗試了文檔中的內容，但仍然無法工作。

預先感謝您:)

Answer 1

coordinate屬性不正確構造。做這樣的事情 -

this.state = { 
    markers: [{ 
    title: 'hello', 
    coordinates: { 
     latitude: 3.148561, 
     longitude: 101.652778 
    }, 
    }, 
    { 
    title: 'hello', 
    coordinates: { 
     latitude: 3.149771, 
     longitude: 101.655449 
    }, 
    }] 
} 

內呈現

<MapView 
    .... 
> 
    {this.state.markers.map(marker => (
    <MapView.Marker 
     coordinate={marker.coordinates} 
     title={marker.title} 
    /> 
))} 
</MapView>