未定义“Google”：在 React JS 中添加 Google Maps API [重复]答案

【问题标题】：'Google' is not defined: adding Google Maps API in React JS [duplicate]未定义“Google”：在 React JS 中添加 Google Maps API [重复]
【发布时间】：2018-02-17 18:13:43
【问题描述】：

这里是 React JS 新手，请多多包涵。

我在 index.html 文件中添加了 Google Maps API 脚本，如下所示：

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="theme-color" content="#000000">

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">

  </head>
  <body>
    
    <div id="root"></div>
  
    <script src="https://maps.googleapis.com/maps/api/js?key=MY-API-IS-HERE"></script>
  </body>
</html>

然后，我安装了google-maps-react 和npm，这样我就可以使用它的组件了。我在我的组件中导入了这个库，如下所示：

import React, { Component } from 'react';
import GoogleMapReact from 'google-map-react';

class BaseMap extends Component {
    constructor() {
        super();
        this.state = {
            center: {lat: 42, lng: 14},
            zoom: 10
        }
    };

    render() {
        let location = {
            center: '',
            zoom: ''
        }

        return (
            <GoogleMapReact>
            </GoogleMapReact>
        );
    }

    myMethod(){
        let geocoder = new google.maps.Geocoder(); 
    }
}

export default BaseMap;

但是，当我尝试使用 google.maps.Geocoder 时，我得到：

Line 30:  'google' is not defined  no-undef

据我所知，google 应该是一个全局的窗口对象，因为我在 html 文件中包含了 Google Maps API 脚本。但是，它没有定义。

有什么想法吗？提前Tnx！

【问题讨论】：

标签： javascript google-maps

【解决方案1】：

好的，这似乎可行：

解决方案是在类上方的变量中隐式定义google，如下所示：

const google = window.google

在这里回答：

google is not defined in react app using create-react-app

【讨论】：

在 React Native 中，有可能吗？
在 React Native 中你需要使用 react-native-maps