Ошибка импорта с примером DrawingManager из реагировать-google-maps / api - PullRequest
0 голосов
/ 13 апреля 2020

Я пытаюсь реализовать пример из react-google-maps/api, но я сталкиваюсь с импортом error.

Это - пример, который я застреваю, чтобы воспроизвести код вам нужен ключ API карт Google. Я не уверен, как воспроизвести «рабочий» пример, не передавая мой.

Вот код, который я пытаюсь запустить:

import React from 'react'
import { GoogleMap, LoadScript } from '@react-google-maps/api'
import { DrawingManager } from '@react-google-maps/api';

const ScriptLoaded = require("node_modules\@react-google-maps\api\src\docs\ScriptLoaded").default;

const RegionSelector = () => {


  const mapContainerStyle = {
    height: "400px",
    width: "800px"
  }

  const center = {
    lat: 38.685,
    lng: -115.234
  }

  const onLoad = drawingManager => {
    console.log(drawingManager)
  }

  const onPolygonComplete = polygon => {
    console.log(polygon)
  }

  return (
    <LoadScript
        id="script-loader"
        googleMapsApiKey="API_KEY"
      >
        <GoogleMap
          id='example-map'
        >
          <ScriptLoaded>
            <GoogleMap
              id="drawing-manager-example"
              mapContainerStyle={mapContainerStyle}
              zoom={2.5}
              center={center}
            >
              <DrawingManager
                onLoad={onLoad}
                onPolygonComplete={onPolygonComplete}
              />
            </GoogleMap>
          </ScriptLoaded>
        </GoogleMap>
      </LoadScript>
  )
}

export default RegionSelector;

Я получаю ошибку :

Модуль не найден: Не удалось разрешить 'node_modules@react-google-mapsapisrcdocsScriptLoaded' в 'MY_FILE_PATH'

Из примера кода документации API:

const { GoogleMap, LoadScript } = require("../../");
const ScriptLoaded = require("../../docs/ScriptLoaded").default;

const mapContainerStyle = {
  height: "400px",
  width: "800px"
}

const center = {
  lat: 38.685,
  lng: -115.234
}

const onLoad = drawingManager => {
  console.log(drawingManager)
}

const onPolygonComplete = polygon => {
  console.log(polygon)
}

<ScriptLoaded>
  <GoogleMap
    id="drawing-manager-example"
    mapContainerStyle={mapContainerStyle}
    zoom={2.5}
    center={center}
  >
    <DrawingManager
      onLoad={onLoad}
      onPolygonComplete={onPolygonComplete}
    />
  </GoogleMap>
</ScriptLoaded>

Что не так с моим импортом? Это правильный модуль?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...