React-native Airbnb-Maps:如何在airbnb地图弹出框内渲染按钮? [英] React-native Airbnb-Maps: How do I render a button inside the airbnb maps pop-up box?

问题描述

我正在尝试使用 AirBnb映射(使用 MapView.Markers ).我不确定如何实现这一目标.

I am trying to render a button which I can use to redirect to another page within the description page (the pop-up-box if you select a marker) using AirBnb maps (using MapView.Markers). I am not sure how to achieve this.

目前我的标记如下:

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无法转换为NSString 错误.(当我这样做时:

Whenever I try to input JSX into a text, I get a NSMutableDictionary cannot be converted to NSString error. (When I do this:

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"
}
];

推荐答案

对于不仅仅是文本，您应该做的是定义自定义

For more than just text, what you should do is define a custom Callout instead of using description prop. For example:

<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 Airbnb-Maps:如何在airbnb地图弹出框内渲染按钮?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！