如何解决加载新元素时保持地图以标记为中心
我正在加载一个包含来自选定地图标记信息的模式。我通过保存所选标记的状态并将其传递给模式中的组件以显示来自该特定标记的信息来实现此目的。因此,标记未聚焦,地图会快速返回其起始位置(在许多情况下,是用户的位置)。
有没有办法以一种不会将地图重置为默认位置的方式来保持焦点或以某种方式加载模态?
这是一个片段:
<View style={styles.mapView}>
<MapView
style={styles.mapView}
showsUserLocation={true}
showsMyLocationButton={true}
region={{
latitude: latitude,longitude: longitude,latitudeDelta: latitudeDelta,longitudeDelta: longitudeDelta,}}>
{
(markerArr = data.map((listing,index) => (
<CustomMarker
key={index}
image={listing.pin}
point={listing.point}
category={listing.categoryID}
place={listing.place}
onPress={() => {
markerPressed(listing);
}}
coordinate={{
latitude: listing.latitude,longitude: listing.longitude,}}
/>
)))
}
</MapView>
<Modal
style={{ position: 'absolute',bottom: 10 }}
animationType="slide"
transparent={true}
visible={modalVisible}
onRequestClose={() => {
setModalVisible(!modalVisible);
}}
setModalVisiblity={() => {
setModalVisible((preState) => (preState = !preState));
}}>
<TouchableOpacity
style={styles.containerT}
activeOpacity={1}
onPressOut={() => {
setModalVisible(false);
}}>
<ScrollView
directionalLockEnabled={true}
contentContainerStyle={{ position: 'absolute',bottom: 35 }}>
<TouchableWithoutFeedback>
<View>
<TouchableOpacity
onPress={() => {
onPressListingItem(selectedMarker);
setModalVisible(false);
}}>
<MapListing
// key={index}
name={selectedMarker.title}
image={selectedMarker.pin}
point={selectedMarker.point}
photo={selectedMarker.photo}
category={selectedMarker.categoryID}
description={selectedMarker.description}
place={selectedMarker.place}
link={() => {
markerLink(selectedMarker);
}}
/>
</TouchableOpacity>
</View>
</TouchableWithoutFeedback>
</ScrollView>
</TouchableOpacity>
</Modal>
</View>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。