私の街のいくつかのモニュメントを示すシーンがあります。マーカー(記念碑)を押すと、記念碑の名前が表示されます。私がやりたいことは、その名前を押すと、決定されたシーンに遷移したいです(react-navigationを使用)。モニュメントの名前を TouchableHighlight でラップし、プレス時に「ナビゲート」メソッドを呼び出します。しかし、それは単に通過しないだけで、何もしません。エラーすらありません。
これが私のコードです:
render(){
const { navigate } = this.props.navigation;
const { data } = this.props.navigation.state.params;
return (
<View style={styles.container}>
<MapView
style={styles.map}
initialRegion={{
latitude: 39.604419,
longitude: -8.411803,
latitudeDelta: 0.0122,
longitudeDelta: 0.0221,
}}
>
{data.map(i => {
if (i.category === "Museus"){
return i.monuments.map((j, index) => (
<MapView.Marker
coordinate={{
latitude: j.latitude,
longitude: j.longitude,
}}
pinColor='#009688'
key={index}
>
<MapView.Callout tooltip style={styles.callout}>
<View style={styles.calloutContainer}>
<TouchableHighlight
onPress={() => navigate('MonumentoDetails')}
style={[styles.bubble, {backgroundColor:'#009688'}]}
>
<View>
<Text style={styles.name}>{j.name}</Text>
</View>
</TouchableHighlight>
<View style={[styles.arrow, {borderTopColor:'#009688'}]} />
</View>
</MapView.Callout>
</MapView.Marker>
))
}
})}
</MapView>
</View>
);
}
}
私は何を間違っていますか?ありがとう!