Javascript 谷歌地图在'；装载地图…'；

我创建了一个名为MapContainer的组件，我的MapContainer.js如下所示：

import { Map, GoogleApiWrapper } from 'google-maps-react';
import React from 'react';
import '../css/MapContainer.css';

const MapContainer = ({ t }) => (
    <Map class="location_map"
    google={t.google}
    zoom={8}
    initialCenter={{ lat: 47.444, lng: -122.176}}/>
)

export default GoogleApiWrapper({
    apiKey: '...'
})(MapContainer);

然后在渲染部分内：

            <div class="polaroid_des">
                <div class="container-list">
                    <p class="polaroid_title">{t('details.location')}</p>
                    <MapContainer t={t} />
                </div>
            </div>  

事实证明，当我运行我的站点时，我只会得到“加载地图…”。发生了什么事？

根据，必须从装饰过的组件道具中抓取

google

实例

import { Map, GoogleApiWrapper } from 'google-maps-react';
import React from 'react';
import '../css/MapContainer.css';

const MapContainer = ({ t, google }) => (
    <Map class="location_map"
    google={google}
    zoom={8}
    initialCenter={{ lat: 47.444, lng: -122.176}}/>
)

export default GoogleApiWrapper({
    apiKey: '...'
})(MapContainer);

从“谷歌地图反应”导入{Map，GoogleApiWrapper}；
从“React”导入React；
导入“../css/MapContainer.css”；
常量映射容器=（{t，google}）=>(
)
导出默认GoogleApprapper({
apiKey:“…”
})（地图容器）；

根据，必须从装饰过的组件道具中抓取

google

实例

import { Map, GoogleApiWrapper } from 'google-maps-react';
import React from 'react';
import '../css/MapContainer.css';

const MapContainer = ({ t, google }) => (
    <Map class="location_map"
    google={google}
    zoom={8}
    initialCenter={{ lat: 47.444, lng: -122.176}}/>
)

export default GoogleApiWrapper({
    apiKey: '...'
})(MapContainer);

从“谷歌地图反应”导入{Map，GoogleApiWrapper}；
从“React”导入React；
导入“../css/MapContainer.css”；
常量映射容器=（{t，google}）=>(
)
导出默认GoogleApprapper({
apiKey:“…”
})（地图容器）；

像两天前一样出现了同样的问题。此库已过时，不再维护。我建议您改用

googlemap-react

。我发现那个图书馆更坚固

Github：

---

NPM:

像两天前一样有同样的问题。此库已过时，不再维护。我建议您改用

googlemap-react

。我发现那个图书馆更坚固

Github：

---

NPM:

@kinduser如果你愿意，你可以回答，我会接受你的回答。我切换到谷歌地图，我使它的工作。当然，我已经添加了一个答案：）@kinduser如果你愿意，你可以回答这个问题，我会接受你的答案。我切换到谷歌地图，我使它的工作。我还必须启用计费表单GCP。当然，我添加了一个答案：）

import { Map, GoogleApiWrapper } from 'google-maps-react';
import React from 'react';
import '../css/MapContainer.css';

const MapContainer = ({ t, google }) => (
    <Map class="location_map"
    google={google}
    zoom={8}
    initialCenter={{ lat: 47.444, lng: -122.176}}/>
)

export default GoogleApiWrapper({
    apiKey: '...'
})(MapContainer);