我正在尝试使标记在 native react 中可点击。例如,对于一个特定的餐厅,我想显示标记,当用户点击它时,显示餐厅的名称(现在可以使用),当用户点击餐厅的名称时,它会直接进入他们的网站。 只是为了它:
constructor(props){
super(props);
this.state = {
name: "",
email: "",
region: {
// luxembourg region
latitude: 49.6116,
longitude: 6.1319,
latitudeDelta: 0.0922,
longitudeDelta: 0.0421,
},
markers: [{
title: 'Royal Bengal',
coordinates: {
latitude: 49.606259,
longitude: 6.105683
}}
]};
}
稍后显示 map :
<MapView
style={styles.map}
region={this.state.region}
showUserLocation = {true}
>
{this.state.markers.map((marker, index) => (
<MapView.Marker
key = {index}
coordinate = {marker.coordinates}
title = {marker.title}
// Icon =
// pinColor = {'#474744'}
/> )
)}
假设我希望用户在点击 Royal Bengal 时转到 google.com,我该怎么做?查看 onPress 和其他文档并没有多大帮助。
最佳答案
<MapView.Marker
key = {index}
onPress={() => Linking.openURL('your-url')}
coordinate = {marker.coordinates}
title = {marker.title}
/>
根据react-native-maps docs ,onPress 事件使标记可点击。 要在设备的默认浏览器中打开链接,请按照 react-native docs 使用 Linking.openURL('your-url')
关于react-native - 可点击的 map View 标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57767502/