<template>
<div class="maps-box" v-if="clubs.search.data.length" id="start">
<GmapMap
:center="{
lat: clubs.search.data[0].latitude,
lng: clubs.search.data[0].longitude,
}"
ref="map"
:zoom="10"
:options="{
fullscreenControl: false,
disableDefaultUI: true,
zoomControl: true,
}"
>
<GmapMarker
:key="index"
v-for="(club, index) in clubs.search.data"
:position="{
lat: club.latitude,
lng: club.longitude,
}"
:clickable="true"
:draggable="true"
:options="{
icon: require('assets/image/marker.svg'),
}"
/>
</GmapMap>
</div>
</template>
<script>
import { gmapApi } from 'vue2-google-maps'
export default {
mounted() {
// maps fitBounds
const bounds = new google.maps.LatLngBounds()
this.clubs.search.data.forEach(n =>
bounds.extend({
lat: n.latitude,
lng: n.longitude,
}),
)
this.$refs.map.fitBounds(bounds)
},
computed: {
google: gmapApi,
...mapGetters({
clubs: 'club/getResult',
}),
},
}
</script>
получаю ошибку постоянно google is not defined
const massive = [
'Max download report 1',
'Felix download report 4',
'Roberto upload report 5',
'Alex download report 1',
'Stef download report 2',
'Sam download report 3',
'Monika upload report 54'
]