OnPress 不适用于 react-native-maps 中的 Marker

Question

我想在按下地图上的Markers之一时执行一些操作。 我拥有的：

1）一个MapView ，像这样：

<MapView
    provider={PROVIDER_GOOGLE}
    initialRegion={this.state.region}
    style={styles.map}>
    {this.displayRouteLocations(locations)}
</MapView>

2) 我的方法displayRouteLocations执行以下操作：

displayRouteLocations(locations) {
    return locations.map((location, i) => {
        return (
            <PointMarker
                key={i}
                coordinate={location}
                title={location.name}
                description={location.description}
                onPress={() => alert('test')}
            />
        );
    });
}

3) 最后， PointMarker是一个单独的组件，如下所示：

import {Marker} from 'react-native-maps';

class PointMarker extends Component {
    render() {
        return (
            <Marker
                {...this.props}
                pinColor={'#f6c23d'}
                tracksViewChanges={false}
            />
        );
    }
}

我不知道为什么onPress在PointMarker上PointMarker 。 我将它传递给 react-native-maps Marker ，但不知何故，当我按下标记时它没有被触发。

我已经尝试在 GitHub 上的 react-native-maps 官方文档中寻找答案。 在这个例子中，它们的作用几乎相同（调用 onPress 箭头函数）。 但是，它在我的情况下不起作用。

我正在 Android 上测试该应用程序。

Answer 1

根据文档，您应该将stopPropagation设置为 true。 像这样 ：

displayRouteLocations(locations) {
    return locations.map((location, i) => {
        return (
            <PointMarker
                key={i}
                coordinate={location}
                title={location.name}
                description={location.description}
                onPress={(e) => {e.stopPropagation(); alert('test');}}
            />
        );
    });
}

更多信息： <Marker />组件 API

更多信息2： 建议