javascript - window.google 在反应中未定义？

Question

当我调用窗口和控制台记录它时，我得到一个谷歌道具，如您在此处看到的：

然而，当我尝试打电话时，window.google我变得不确定。我在这里错过了什么吗？

标签： javascriptreactjsgoogle-maps

Answer 1

嘿，我在尝试实例化新的 window.google.maps.Map时遇到了类似的问题，发现这个解决方案对我有帮助。

1. 声明<script>标签时，给它一个标识符，以便稍后在组件中获取它。

2. 在安装组件时，在 Google 脚本上设置一个load事件监听器，并等待它准备好再执行更多代码。

3. 需要注意的是，如果您的脚本在此组件挂载之前加载（我们一开始希望如此）并设置事件侦听器，则不会发生任何事情。我们想抓住这个积极的条件if (window.google)

componentDidMount() {
  const googleScript = document.getElementById('google-map-script')

  if (window.google) {
    // All is good! Carry on 
  }

  googleScript.addEventListener('load', () => {
    // Patiently waiting to do the thing 
  })
}