Какой лучший способ загрузить карту Google в Vuejs?

Question

Шаг-1

Я загружал карту Google в тег скрипта и вызвал функцию обратного вызова initMap, поэтому карта инициализируется и переменная карты была доступна в браузере, так каквнутри компонента Vue.

<script>
  function initMap() {
    map = new google.maps.Map(document.getElementById('map'), {
      zoom: 11.8,
      center: {lat: 17.42, lng: 78.3867}
    })
  }
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=API-KEY&libraries=places&callback=initMap"></script>

Так я изначально загрузился, и переменная карты была доступна внутри метода Vue после загрузки карты.Но когда страница загружается, мне пришлось вызвать некоторую функцию, которая помещает многоугольник на карту, поэтому я попытался внутри mounted() вызвать функцию, но переменная карты была недоступна.

Шаг-2

Теперь я изменился на пакет vue2-google-maps, все еще находящийся внутри mounted() Я могу видеть mapPromise, а не объект map.

Шаг-3

Я снова вернулся к тегу сценария, а затем вместо вызова initMap внутри тега сценария HTML (после просмотра ответа StackOverflow) я написал компонент таким образом и вызвал функцию, с которой он работает.Это правильный способ загрузить карту Google и сохранить карту внутри объекта данных?

methods: {
  initMap() {
    this.map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: 17.42, lng: 78.3867},
          zoom: 11.8
          })
  }
},
mounted(){
  this.initMap()
  this.$refs.ghmcZone.click()
}