react-native - 如何访问 react-native-maps MapView 的所有 MapView.Markers?

标签 react-native react-native-maps

在使用 react-native-maps 的 native 应用程序中,我试图以编程方式显示 MapView.Callout特定的 MapView.Marker在许多之中。我打算使用 showCallout 方法,但还没有找到如何访问 MapView 的所有标记,我可以从那里根据它的 id/key/ref 选择正确的标记。

标记在 map 循环中渲染到 MapView 上,如下所示。

到目前为止,我尝试使用 this.refs.mapView.refs/this.refs.mapView.children 来获取所有 MapView 的标记但没有成功,但我在那里什么也没得到。

<MapView>
    ref={'mapView'}
    ...
>
    {this.props.screenProps.appState.cachedDeviations.map(deviation => {
        return (
            <MapView.Marker
                coordinate={
                    deviation.position
                }
                key={deviation.Id}
                ref={deviation.Id}
            >
                <MapView.Callout style={styles.callout}>
                    <DeviationCallout
                        ...
                    />
                </MapView.Callout>
            </MapView.Marker>
        )
    })
}
</MapView>

任何提示?

最佳答案

您可以使用功能引用。

示例

<MapView.Marker
    coordinate={ deviation.position }
    key={deviation.Id}
    ref={(ref) => this.markers[deviation.Id] = ref}
>
  // ...
</<MapView.Marker>

// ...

this.markers[someId].showCallout();

关于react-native - 如何访问 react-native-maps MapView 的所有 MapView.Markers?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47267197/

相关文章:

android - react-native 获取当前日期

json - 为什么在我的 React-Native FlatList 中有 double 和相同的键?

react-native - 在 react native 中单击 map View 上的任意位置时如何放置标记

react 原生 map : MapView with the Animated API is lagging too much in android

android - react native navigator.geolocation.getCurrentPosition 不工作

react-native - 未找到 React Native ios 'GoogleMaps/GoogleMaps.h' 文件

Android AAR 库 - bundle node_modules

javascript - 二维数组状态

node.js - 错误 selenium-webdriver@4.5.0 : The engine "node" is incompatible with this module. 预期版本 ">= 14.20.0"。得到 "14.17.4"

react-native - 使用 react-native-maps 在 ReactNative 中获取当前位置、纬度和经度