如何在 react-native-maps 上预先选择标记?

问题描述 投票:0回答:1

我试图在反应本机应用程序中显示预选标记。我正在使用 react-native-maps 来显示地图。选择/点击地图中的标记会在底部显示一个带有行车路线按钮的小工具栏。 当我显示只有 1 个标记的地图时,我希望它被预选并显示该工具栏,但到目前为止我没有找到执行此操作的选项。地图显示时没有工具栏,工具栏仅在标记被点击后出现。 这是我的代码。注意预选选项。根据文档,它仅适用于 iOS,我目前正在 Android 上试用。如此可以理解,它不起作用。我有它只是为了 iOS。我会尝试在某个时候拿到 iphone 并在那里进行测试,但我正在寻找一种可以在 Android 和 iOS 上运行的解决方案。

<MapView
   style={{ flex: 1 }}
   initialRegion={{
     latitude: item.lat,
     longitude: item.lon,
     latitudeDelta: 0.0411,
     longitudeDelta: 0.0211,
   }}
   scrollEnabled={false}
   zoomEnabled={false}
>
   <Marker coordinate={{ latitude: item.lat, longitude: item.lon }} isPreselected={true} />
</MapView>
reactjs react-native react-native-maps
1个回答
0
投票

您可以通过 useRef 将引用添加到标记,然后在地图渲染时使用 ref.showCallout() 始终在渲染上显示标注。

import React, {useRef} from 'react';
import MapView from 'react-native-maps';

export default props => {
  const markerRef = useRef(null);

  const onRegionChangeComplete = () => {
    if (markerRef && markerRef.current && markerRef.current.showCallout) {
      markerRef.current.showCallout();
    }
  };

  return (
      <MapView onRegionChangeComplete={onRegionChangeComplete}>
        <MapView.Marker ref={this.markerRef}/>
      </MapView>
  );
};

请看这里:链接

最新问题
© www.soinside.com 2019 - 2025. All rights reserved.