我有以下源代码,当我尝试用 google.maps ...
实例化一个新变量时,我也遇到了以下错误:
google' is not defined
许多答案都谈到在其他所有内容之前异步加载 API 脚本,脚本的顺序很重要,但我认为这不是我的问题。
PS: 我在 main.js
中使用了它
Vue.use(VueGoogleMaps, {
load: {
key: 'MY-KEY',
libraries: 'places', //// If you need to use place input
},
})
谁能帮帮我?谢谢。
<div class="map-container">
<gmap-map
id="map"
ref="map"
:center="center"
:zoom="15"
map-type-id="roadmap"
style="width:100%; height: 400px;">
<gmap-marker
:key="index"
v-for="(m, index) in markers"
:position="m.position"
@click="center=m.position"
></gmap-marker>
</gmap-map>
</div>
<script>
import _ from 'lodash'
import { mapState } from 'vuex'
import * as VueGoogleMaps from 'vue2-google-maps'
export default {
computed: {
...mapState([
'map',
]),
mapStyle: function () {
const h = document.body.clientHeight - 80
return 'width: 100%; height: ' + h + 'px'
},
center: function () {
return { lat: 44.837938, lng: -0.579174 }
},
},
mounted: function () {
VueGoogleMaps.loaded.then(() => {
var map = new google.maps.Map(document.getElementById('map'))
}
},
最佳答案
由于您已将所有内容导入为 VueGoogleMaps
,因此我假设 google
在此对象中。
编辑:似乎 google
对象被称为 gmapApi
。
所以改变
var map = new google.maps.Map(document.getElementById('map'))
到
let map = new VueGoogleMaps.gmapApi.maps.Map(document.getElementById('map'))
由于您没有显式导入任何内容,因此它应该全部位于 VueGoogleMaps
中。因此,如果您想将其命名为 google
,请按照其他答案中的描述添加计算字段,但 gmapApi
应位于 VueGoogleMaps
中。
所以
computed: {
google: VueGoogleMaps.gmapApi
}
关于javascript - VueJS,引用错误: google is not defined,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54803405/