2017-08-11 35 views
1
import React from 'react'; 
import { withGoogleMap, GoogleMap, Marker } from 'react-google-maps'; 

// const googleMapURL = 'https://maps.googleapis.com/maps/api/js?v=3.27&libraries=places,geometry&key=AIzaSyASIGvujxniBb3bX8ZwMHjHbM13Ah6q9X'; 
const Map = props => (
    <GoogleMap 
    defaultZoom={16} 
    defaultCenter={{ lat: 40.6219853, lng: -73.94007739999999 }} 
    > 
    { 
     props.displayed.forEach(device => device.locations.map((location, i) => (
     <Marker 
      key={i} 
      postion={{ lat: location.latitude, lng: location.longitude }} 
      label={device.deviceName} 
     /> 
    ))) 
    } 
    </GoogleMap> 

); 
export default withGoogleMap(Map); 

我不能讓我的標誌,以顯示在地圖渲染罰款傳遞的數據是正確的我的控制檯登錄它我得到的Web包或控制檯沒有錯誤不能讓我的標記加載

enter image description here

+0

你有一個錯字,太:'postion'也許應該是'position'。 – AKX

+0

感謝改變它,但仍然不工作 –

回答

1

即使你從一個foreach循環內返回,返回值是不確定的。你實際上需要返回一個標記列表來作出反應來渲染它們,所以把它切換到一個地圖上,並且所有的東西都應該可以工作。

可以很容易地測試了這一點自己:

var a = [1,2,3]; 
a.forEach(b => b); // returns undefined 
a.map(b => b); // returns [1, 2, 3] 
+0

=>()是返回速記 –

+0

是的,forEach內的映射正在返回,但即使從forEach循環內部返回,它也有一個未定義的返回值。將forEach更改爲地圖,它應該可以工作。 – Andrew

+0

謝謝你的工作 –