如何在MapView对象中循环数组

Question

我有一个MapView，我想添加标记。我可以成功地单独添加标记，但我想循环遍历一个坐标数组，并为数组中的每个位置添加标记。每当尝试运行这段代码时，我都会得到一个"意外的记号"。for循环开始时出现错误。我读过关于在数组上使用.map函数的建议，但这似乎也不适合我。如有任何帮助，我将不胜感激。

const ViewNearbyScreen = ({
navigation, route
}) => {
const points = [
{
name: "Wendys",
lat: 37.4319983,
lng: -122.094,
},
{
name: "Taco Bell",
lat: 37.4419983,
lng: -122.104,
},
{
name: "Whataburger",
lat: 37.4519983,
lng: -122.114,
},
];
return (
<MapView
provider={PROVIDER_GOOGLE}
style={{flex: 1}}
region={{
latitude: 37.4219983,
longitude: -122.084,
latitudeDelta: 0.0922,
longitudeDelta: 0.0421
}}
ref={mapRef}
showsUserLocation>
{for(let i = 0; i < 3; i++) {
<Marker
coordinate={{
latitude: points[{i}].lat,
longitude: points[{i}].lng,
}}
title={points[{i}].name}
/>
}}
</MapView>
)
};

Answer 1

可以使用Array Map方法遍历数组元素。

points.map(item => { // each point in points array
return (
<Marker
coordinate={{
latitude: item.lat,
longitude: item.lng,
}}
title={item.name}
/>
)
})

map方法不能为你工作的原因可能是你忘记返回你的jsx。