如何在 react-native-maps 弹出框内渲染按钮？

Question

我正在尝试使用 AirBnb 地图呈现一个按钮，我可以使用该按钮重定向到描述页面中的另一个页面（如果您 select 一个标记，则为弹出框） （使用 MapView.Markers）。我不确定如何实现。

目前我的标记如下：

const markers = [{
  longitude: 8.545592,
  latitude: 47.366465,
  description: "Bike 1",
  title: "Bike 1"
},
{
  longitude: 8.545892,
  latitude: 47.366365,
  description: "Bike 2",
  title: "Bike 2"
}
];

每当我尝试将 JSX 输入文本时，我都会收到 NSMutableDictionary cannot be converted to NSString 错误。（当我这样做时：

const markers = [{
  longitude: 8.545592,
  latitude: 47.366465,
  description: <Text>Bike1</Text>, //"Bike 1", //<Text> Bike1 </Text>
  title: "Bike 1"
},
{
  longitude: 8.545892,
  latitude: 47.366365,
  description: "Bike 2",
  title: "Bike 2"
}
];

Answer 1

对于不仅仅是文本，您应该做的是定义自定义 Callout 而不是使用 description 道具。例如：

<MapView.Marker
  coordinate={{longitude: marker.longitude, latitude: marker.latitude}}
  title={marker.title}
>
  <MapView.Callout>
    <View style={styles.callout}>
      <Button title='Click Me!' onPress={() => console.log('Clicked')} />
    </View>
  </MapView.Callout>
</MapView.Marker>

如何在 react-native-maps 弹出框内渲染按钮？

How do I render a button inside the react-native-maps pop-up box?

react-native

react-native-maps