window.google是未定义的反应？

Question

当我打电话给窗口和控制台登录时，我会看到谷歌道具：

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

Answer 1

由于它看起来像Google Maps API，因此可能是加载订单问题。

确保提取Google地图标记的<script>位于运行您的React代码之前。

如果这不是问题，您可能需要将React代码包装在某种ready()函数中，以强制它等到Google代码准备就绪。

Answer 2

嘿，我遇到了一个类似的问题，试图实例化 new window.google.maps.Map ，发现该解决方案对我有所帮助。

1. 在声明load标记时，为其提供一个标识符，以便稍后可以在组件中使用它。

2. 在安装组件时，在Google脚本上设置一个if (window.google)事件侦听器，并等待其就绪，然后再执行其他代码。

3. 一个警告是，如果在此组件挂载之前加载脚本（首先希望这样做）并设置事件侦听器，则不会发生任何事情。我们想用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 }) }

来捕捉这种积极的状况

{{1}}

Answer 3

关于此的最新答案，但是您可以简单地将此const添加到React组件的顶部，在import语句下方：

using namespace std;

它a）创建一个变量，然后b）使用三元运算符确定window.google是否已加载，c）否则，它将google分配为空对象。 H / t到@blackmamba。有关更多上下文，请参见其他SO question。