如何解决反应本地地图onPress标记掉落问题
我一直试图在触摸地图时在地图上放一个大头针,但我不断出错: 更新由airmap空纬度管理的视图的属性“区域”时发生错误
我已经创建了常量markerPress并将其添加到MapView onPress中,然后更新了MapView.Marker
我试图将标记useState从null更改为空对象,但没有任何运气。请帮忙。
import React,{useState,useEffect} from 'react';
import {StyleSheet} from 'react-native';
import MapView,{ PROVIDER_GOOGLE } from 'react-native-maps';
import * as Location from "expo-location";
function HomeScreen({navigation}) {
const [location,setLocation] = useState(null);
const [mapRegion,setMapRegion] = useState(null);
const [errorMsg,setErrorMsg] = useState(null);
const [marker,setMarker] = useState(null)
const markerPress = (event) => {
setMarker({ marker: event.nativeEvent.coordinate })
}
useEffect(() => {
(async () => {
let { status } = await Location.requestPermissionsAsync();
if (status !== "granted") {
setErrorMsg("Permission to access location was denied");
}
let coordinates = await Location.getCurrentPositionAsync({});
setLocation(location);
setMapRegion({
longitude: coordinates.coords.longitude,latitude: coordinates.coords.latitude,longitudeDelta: 0.0922,latitudeDelta: 0.0421
});
})();
},[]);
return (
<MapView
provider={PROVIDER_GOOGLE}
onPress={markerPress}
style={{flex:1}}
customMapStyle = { generatedMapStyle }
showsUserLocation={true}
followsUserLocation={true}
showsMyLocationButton={true}
initialRegion={mapRegion}>
{
marker &&
<MapView.Marker coordinate={marker} />
}
</MapView>
)
}
const styles = StyleSheet.create({
map: {
...StyleSheet.absoluteFillObject
}
})
解决方法
您应将您的setMarker
呼叫更改为:
setMarker(event.nativeEvent.coordinate);
event.nativeEvent.coordinate
已经是coordinate
道具的有效值。
因此要传递给coordinate
的正确对象看起来像这样:
{
latitude: ...,longitude: ...
}
您通过了此操作
{
marker: {
latitude: ...,longitude: ...
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。