如何在 React Native 的不同 colors 中使用谷歌地圖標記？

Question

我希望id: 0的標記為紅色， id: 1的標記為綠色，但目前兩個標記的顏色相同，紅色或綠色取決於Marker中的icon 。 有人有建議嗎？

constructor(props) {
  super(props);
  this.state = {
    coordinates: [
      {id: 0, latitude: 37.789086, longitude: -122.432216},
      {id: 1, latitude: 37.787217, longitude: -122.431830}
    ],
    redMarker: require('./markers/red.png'),
    greenMarker: require('./markers/green.png')
  }
}

<MapView>
  {this.state.coordinates.map((marker, index) => (
    <Marker
      key = {index}
      tracksViewChanges = {false}
      coordinate = {{
        latitude: marker.latitude, 
        longitude: marker.longitude
      }}
      icon = {this.state.greenMarker}>
    </Marker>
  ))}
</MapView>

Answer 1

只需使用模運算符：

icon = {index % 2 === 0 ? this.state.greenMarker : this.state.redMarker}>