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）。 演示代码将这两个组件分开放置。