React google maps sdk не отображается

Question

, поэтому я пытаюсь создать в своем приложении для реагирования SDK карт Google и перетаскиваемый маркер, чтобы при перемещении маркера требовалось немного широты и долготы.

Я пробовал кое-что, что я найдено в Интернете, но ничего не загружает, но и у меня тоже нет ошибок.

Я сделал что-то не так?

Код:

import React, { Component } from 'react';
export default class Location extends Component {
componentDidMount() {
    this.renderMap();
}

renderMap = () => {

    window['initMap'] = () => {
      this.loadMap();      
    }
    if(!window.document.getElementById('google-map-script')) {
      var s = window.document.createElement("script");
      s.id = "google-map-script";
      s.type = "text/javascript";
      s.src = "https://maps.googleapis.com/maps/api/js?key=&callback=initMap";

      window.document.body.appendChild(s);
    } else {
      this.loadMap();
    }
}

loadMap = () => {

    var map = new window['google'].maps.Map(this.refs.map, {
        center: {lat: 22.7196, lng: 75.8577},
        zoom: 8
    });

    var marker = new window['google'].maps.Marker({
        position: {lat: 22.7196, lng: 75.8577},
        map: map,
        title: 'Hello World!',
        draggable: true,
        animation: window['google'].maps.Animation.DROP,
    });

    var contentString = '<div id="content">'+
    '<div id="siteNotice">'+
    '</div>'+
    '<h3 id="thirdHeading" class="thirdHeading">W3path.com</h3>'+
    '<div id="bodyContent">'+
    '<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>'+
    '</div>'+
    '</div>';

    var infowindow = new window['google'].maps.InfoWindow({
        content: contentString
    });

    marker.addListener('click', function() {
        infowindow.open(map, marker);
    });

}    

render() {

  return (
    <div className="row mt-5">
        <div className="col-md-10 mx-auto">
            <h2 className="text-left">Google Map</h2>
            <div className="card mt-3">
                <div className="card-body">
                    <div ref="map" style={{'width':'100%', 'height':'400px' }}></div>
                </div>
            </div>
        </div>
    </div>
  );
}
}

Кстати, у меня уже есть свой ключ api, но я не показываю его по соображениям безопасности.

Надеюсь, все понимают, что я сказал, в противном случае прокомментируйте, чтобы я мог ответить с дополнительной помощью.