google 沒有在 @react-google-maps/api 的 Gatsby js 應用程序中定義

Question

我遇到了這個 npm package for gatsby @react-google-maps/api 的問題我收到了一個 google is not defined 錯誤。 我知道這與 Gatsby 需要將變量設置為 window.google 有關，但我不太確定如何使用這個 package 來做到這一點。

到目前為止，這是我的代碼

import { LoadScript, GoogleMap } from "@react-google-maps/api"
const MapFooter = () => {
  return (
    <>
      <LoadScript
        googleMapsApiKey="fdsaf"
        region="EN"
        version="weekly"
      />
      <GoogleMap id="ground-example" zoom={13} />
    </>
  )
}

Answer 1

您好，我遇到了一個白色 package 問題，我解決了更精確地返回以前的版本@react-google-maps/api": "^1.9.4

Answer 2

我需要將<GoogleMap></GoogleMap>組件放在<LoadScript></LoadScript>內部（我使用的是 React 16 + GatsbyJs）。 演示代碼將這兩個組件分開放置。