TypeError：未定义GoogleMap

Question

我将API数据传递给了地图组件，当我使用地图函数将api数据中的位置用于标记时，出现了此错误：“ this is undefined”，它指向GoogleMap标记，但地图可以正常工作如果我拿走代码的标记部分。我做错了什么？

我已经添加了这个常量google = window.google;到我的代码的开头，但是不起作用。下面是我的代码。

import React, { Component } from 'react';
import { GoogleMap, withScriptjs, withGoogleMap, Marker } from 'react-google-maps';

function Maps() {

  return (

    <GoogleMap
      defaultZoom={14}
      defaultCenter={{ lat: 60.169857, lng: 24.938379 }}
    >

      {this.props.apiData.map((event => (

        <Marker
          key={event.id}
          position={{
            lat: event.location.lat,
            lng: event.location.lon
          }}

        />

      )))}
    </GoogleMap>
  );
}

const WrappedMap = withScriptjs(withGoogleMap(Maps));


export default class App extends Component {
  render() {

    console.log(this.props.apiData);
    return (
      <div style={{ width: "100vw", height: "100vh" }}>
        <WrappedMap
          googleMapURL={`https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=geometry,drawing,places&key=${process.env.REACT_APP_API_KEY}`}
          loadingElement={<div style={{ height: "100%" }} />}
          containerElement={<div style={{ height: "100%" }} />}
          mapElement={<div style={{ height: "100%" }} />}
        />

      </div>

    );
  }
}

我希望在屏幕上看到该标记，但只会显示此错误，提示“未定义GoogleMap”。