谷歌地图API界面显示，但内容没有加载;没有抛出错误，使用VUE和API密钥

Question

我目前正在使用Vue和Vue2谷歌地图。当我的网页加载时，谷歌地图的用户界面会显示出来(缩放按钮，全屏(，当我试图在控制台周围拖动地图时，显示我正在接收来自谷歌API的信息。然而，实际的地图本身是空白的，没有任何显示。

<GmapMap :center="{lat:10, lng:10}" :zoom="12" map-type-id="terrain" style="width:750px; height:750px" ></GmapMap>

在Vue的main.js下，我已经声明了我的API密钥，并相应地使用GoogleMaps。

Vue.use(VueGoogleMaps, {
load:{
key:'REDACTED',
}
});

我已经确保我的高度和宽度设置为PX值，并尝试摇动浏览器等。我遵循了一个单独的教程，该教程不使用Vue，但在文档html中包含<script>标记，我无法在Vue模板中执行，因为它们被忽略了。控制台也不会显示任何错误。

我将感谢任何帮助！非常感谢。

Answer 1

我找到了解决方案。我有一个CSS样式的背景颜色，这是覆盖谷歌地图显示的一切。此样式在app.vue父组件中，而我正在子组件

<style> 
*{
background-color: aliceblue;
}
</style>