I would like to perform some action when pressing one of the Markers on a map. What I have:
1) A MapView, like this:
<MapView
provider={PROVIDER_GOOGLE}
initialRegion={this.state.region}
style={styles.map}>
{this.displayRouteLocations(locations)}
</MapView>
2) My method displayRouteLocations does the following:
displayRouteLocations(locations) {
return locations.map((location, i) => {
return (
<PointMarker
key={i}
coordinate={location}
title={location.name}
description={location.description}
onPress={() => alert('test')}
/>
);
});
}
3) Finally, PointMarker is a separate component like this:
import {Marker} from 'react-native-maps';
class PointMarker extends Component {
render() {
return (
<Marker
{...this.props}
pinColor={'#f6c23d'}
tracksViewChanges={false}
/>
);
}
}
I don't know why onPress doesn't work on PointMarker. I pass it to react-native-maps Marker, but somehow it isn't triggered when I press on the markers.
I already tried searching for answers in react-native-maps official documentation on GitHub. In this example they do pretty much the same (call an arrow function onPress). However, it doesn't work in my case.
I'm testing the app on Android.