<GoogleMap
defaultZoom={props.zoom}
defaultCenter={props.center}
>
{props.places &&
props.places.map((place, i) => {
if (!props.providerDetailsId) {
if (place.providerKey === props.setSelectedCard) {
iconName = 'http://maps.google.com/mapfiles/ms/icons/yellow.png'
} else {
iconName = markerImages
}
return (
<Marker
id={place.id}
key={place.id}
position={{lat: lat, lng: lng}}
icon={iconName}
onMouseOver={ () => props.onToggleOpen(this, i)}
onMouseOut={ () => props.onToggleMouseOut(this, i)}
onClick={ () => props.onClick(place.providerKey, props)}
>
{props.infoWindows[i].isOpen && (
<InfoWindow onCloseClick={() => props.onToggleOpen(i)}>
<Hover>
<div >
{"index " + i +"-"+ place.providerKey}
<HoverLink href="#">{place.displayName}</HoverLink>
</div>
</Hover>
</InfoWindow>
)}
</Marker>
);
} else {
if (place.providerKey.toString() === props.providerDetailsId) {
console.log(place.providerKey.toString() +"====" + props.providerDetailsId)
iconName = 'http://maps.google.com/mapfiles/ms/icons/yellow.png'
return (
<Marker
id={place.id}
key={place.id}
position={{lat: lat, lng: lng}}
icon={iconName}
onMouseOver={props.onToggleOpen.bind(this, i)}
onMouseOut={props.onToggleMouseOut.bind(this, i)}
onClick={props.onClick(place.providerKey, props)}
>
{props.infoWindows[i].isOpen && (
<InfoWindow onCloseClick={props.onToggleOpen.bind(i)}>
<Hover>
<div >
{"index " + i +"-"+ place.providerKey}
<HoverLink href="#">{place.displayName}</HoverLink>
</div>
</Hover>
</InfoWindow>
)}
</Marker>
);
}
}
})}
</GoogleMap>
以下是带有标记的示例GoogleMap的代码段。 在此代码段中的if和else中包含Marker。可以将代码格式化,让我知道如何创建单独的函数并从那里返回Marker。 我的要求是格式化标记代码,是否可以通过任何方式创建标记功能并从那里返回标记代码,而不是将代码分成if。