Javascript 反应本机AirBnb贴图不渲染

所以在构造函数中，我定义了一个状态

this.state = {
  markers: [{
            title: "Bike1",
            description: "Bike1",
            latitude: 38.232,
            longitude: -121.3312186
          },
          {
            title: "Bike2",
            description: "Bike2",
            latitude: 39.532,
            longitude: -123.5312186
          }]
}

稍后，我调用函数将所有标记映射到实际的

MapView.markers

情况如下：

{this.state.markers.map( marker => {
          console.log(JSON.stringify(marker));
          <MapView.Marker
          coordinate={{longitude: marker.longitude, latitude: marker.latitude}}
          title={marker.title}
          description={marker.description}
          >
          <View style={styles.bikeRadius}>
            <View style={styles.bikeMarker}></View>
          </View>
          </MapView.Marker>
        })}

{this.state.markers.map（marker=>{
log（JSON.stringify（marker））；
})}

然而，当我调用一个标记时，这是有效的

<MapView.Marker coordinate={{latitude: this.state.gpsPosition.latitude, longitude: this.state.gpsPosition.longitude}}>
        <View style={styles.radius}>
          <View style={styles.marker}></View>
        </View>
      </MapView.Marker>

我是个新手，不知道自己做错了什么。有什么建议吗

指向完整文件的链接是

请尝试将“标记”放在括号中：

{this.state.markers.map( (marker) => {...

尝试将“标记”放在括号中：

{this.state.markers.map( (marker) => {...

---

您没有从

映射

函数返回任何要渲染的内容。快速修复方法是这样做：

{this.state.markers.map( (marker, index) => {
  console.log(JSON.stringify(marker));
  return (
    <MapView.Marker
      key={index}
      coordinate={{longitude: marker.longitude, latitude: marker.latitude}}
      title={marker.title}
      description={marker.description}
    >
      <View style={styles.bikeRadius}>
        <View style={styles.bikeMarker}></View>
      </View>
    </MapView.Marker>
  )
})}

{this.state.markers.map（（marker，index）=>{
log（JSON.stringify（marker））；
返回(
)
})}

---

我还介绍了一种使用

map

函数中的

索引添加
键的简单方法，因为以这种方式使用
map
时，您将得到一个警告。
您不会从
map
函数返回任何要渲染的内容。快速修复方法是这样做：

{this.state.markers.map( (marker, index) => {
  console.log(JSON.stringify(marker));
  return (
    <MapView.Marker
      key={index}
      coordinate={{longitude: marker.longitude, latitude: marker.latitude}}
      title={marker.title}
      description={marker.description}
    >
      <View style={styles.bikeRadius}>
        <View style={styles.bikeMarker}></View>
      </View>
    </MapView.Marker>
  )
})}

{this.state.markers.map（（marker，index）=>{
log（JSON.stringify（marker））；
返回(
)
})}

我还介绍了一种使用
map
函数中的
索引添加
键
的简单方法，因为这样使用
map
时，您会得到一个警告。
否则，您需要查看整个代码来了解发生了什么。不幸的是，这没有帮助，但我真的很感谢你的回答！：）为了不把文章弄得太乱，我编辑了一个到CodePenI的链接，稍后我会看一看！Thx用于发布链接。否则，需要查看您的全部代码才能了解发生了什么。不幸的是，这没有帮助，但我非常感谢您的回答！）为了不把文章弄得太乱，我编辑了一个到CodePenI的链接，稍后我会看一看！Thx用于发布链接。