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： 建議