React Native Maps 自定义标记阻塞标记 onPress

Question

我将自定义标记呈现到我的地图上，并且完全按照我的意愿进行。我正在使用自定义标记，它是视图、图像，然后是特定于图像上事件的文本。

出于某种原因，使用自定义标记视图会阻止标记组件上的 onPress。

我已经测试了 onPress 事件，类似于下面的测试：

<Marker onPress={() => {console.log('Pressed')}}> ... 但仅在我删除标记组件内的自定义标记视图时才记录新闻消息。

自定义标记视图停止 onPress 是否有原因？我如何解决这个问题并为自定义标记触发 onPress 事件？

在下面添加了完整的代码以获得更好的外观。现在它正在工作，但这只是因为我正在为 iOS 使用 onSelect 事件。 onPress 的工作方式与 Android 相同，但与 iOS 不同。

<MapView 
    style={styles.map} 
    ref={ map => {this.map = map }}
    region={this.state.region}
    onRegionChangeComplete={this.onRegionChange}
    rotateEnabled={false}
    loadingEnabled={true}
>
    {matches.map((marker, index) => {
            return (
                <MapMarker 
                    key={index}
                    mapMarker={marker}
                    handlePress={() => {
                        this.map.animateToRegion({
                            latitude: marker.location.latlng.latitude,
                            longitude: marker.location.latlng.longitude
                        }, 100)
                    }}
                />
            )
    })} 
</MapView>

MapMarker.js

render() {
        const { mapMarker } = this.props;

        return (
            <Marker
                ref={(ref) => {this.markerRef = ref; }}
                coordinate={mapMarker.location.latlng}
                title={mapMarker.location.streetName}
                stopPropagation={true}
                pointerEvents='auto'
                onPress={() => console.log('pressed')}
                onSelect={() => {
                    this.props.handlePress();
                }}
            >

                <CustomMapMarker 
                    gameType={mapMarker.matchType} 
                    isSanctioned={mapMarker.isSanctioned}
                    startDate={mapMarker.startAt}
                />

                <Callout style={styles.customCallout}>
                    <CustomMarkerCallout markerInfo={mapMarker} /> 
                </Callout>
            </Marker>
        );
    }

Answer 1

通过添加特定于 iOS 的 onSelect 解决了该问题。 onPress 仅适用于 Android，所以不知道这是否是正确的答案，但目前对我有用。

React Native Maps 自定义标记阻塞标记 onPress

React Native Maps Custom Marker blocking Marker onPress

reactjs

react-native

react-native-maps