如何添加链接（url）以反应原生地图标注？

Question

我尝试这样做：

<MapView.Marker id={marker.id} 
       coordinate={marker.coordinates} 
       title={marker.title}> 
       <MapView.Callout style={styles.callout} > 
     <Text style={styles.link} onPress={this.openUrl.bind(this)}> 
        {this.props.marker.link} 
     </Text> 
    </MapView.Callout> 
</MapView.Marker> 

不过的OpenURL功能不调用。

Answer 1

文本不含onPress回调，从文本移动onPress到MapView.Callout。

<MapView.Callout 
     onPress={this.openUrl.bind(this)} 
     style={styles.callout} 
     > 
      <Text style={styles.link}> 
       {this.props.marker.link} 
      </Text> 
</MapView.Callout> 

更新： 对于有多个链接，您可以使用自定义标注。从标注删除onPress和点击的孩子加入到标注：

 <MapView.Callout 
     style={styles.callout} 
     > 
     <TouchableOpacity 
      onPress={()=>{this.openUrl(this.props.marker.link1)}} 
     > 
      <Text style={styles.link}> 
      {this.props.marker.link1} 
      </Text> 
     </TouchableOpacity> 
     <TouchableOpacity 
      onPress={()=>{this.openUrl(this.props.marker.link2)}} 
     > 
      <Text style={styles.link}> 
      {this.props.marker.link2} 
      </Text> 
     </TouchableOpacity> 
     </MapView.Callout>