React Native Maps(Mapview Marker)不起作用

Question

以下是我的代码段。请参考 MapView.Marker，即使给出我当前位置的坐标，也不会显示任何内容，当我绘制服务位置数组并使用它提供纬度、经度值时，也会观察到相同的行为。

当我像这样使用地图视图标记时，会显示一个标记，但对于这个组件，我必须在地图上显示具有不同坐标的多个标记，我必须使用 Mapview.Marker。请指出我在这里错过了什么。

export default class index extends Component {
constructor(props) {
super(props);
this.state = {
text: "",
source: require("../../Image/User_default.png"),
location: {
latitude: 0,
latitudeDelta: 0,
longitude: 0,
longitudeDelta: 0,
},
serviceLocations: [],
};
}
componentDidMount() {
this._getLocationAsync();
this._getServices();
}
_getServices = () => {
create_service
.getAllServices()
.then((res) => {
this.setState({
serviceLocations: res,
});
})
.catch((error) => {
console.log(error);
});
};
_getLocationAsync = async () => {
let { status } = await Permissions.askAsync(Permissions.LOCATION);
if (status !== "granted") {
Alert.alert("Error", "Permission to access location was denied", [
{ text: "OK" },
]);
} else {
let location = await Location.getCurrentPositionAsync({});
location_service
.setCurrentUserLocation(location)
.then(async (res) => {
// console.log("_getLocationAsync:", res);
})
.catch((err) => console.log(err));
}
};
render() {
const { serviceLocations } = this.state;
return (
<View style={style.container}>
<MapView
style={style.mapStyle}
provider={PROVIDER_GOOGLE}
region={{
latitude: 33.650073,
longitude: 73.153164,
latitudeDelta: 0.0921,
longitudeDelta: 0.0421,
}}
showsUserLocation={true}
/>
<Marker/>
{serviceLocations.length
? serviceLocations.map((serviceLocation,key) => {                 
return (
<MapView.Marker
coordinate={{
latitude: 33.650073,
longitude: 73.153164,
}}
key={key}
// image={require("../../Image/location-pin.png")}
/>
);
})
: null}
</View>
);
}
}

Answer 1

自己对解决方案进行了排序。实际上，我在这段代码中做错的是我在<MapView>范围内使用了<Marker>，这就是为什么我的地图上没有显示标记的原因。 一旦我纠正了范围问题，我的问题就解决了。