Question

无法使用带有 load-google-maps-api-2 的 webpack 读取未定义的属性“自动完成”

2018-09-05

7072

javascript webpack google-places-api

我尝试使用地图 javascript api 地点自动完成来设置自动完成，但我一直收到。

Uncaught (in promise) TypeError: Cannot read property 'Autocomplete' of undefined

index.js

var loadGoogleMapsApi = require('load-google-maps-api-2');
const indexTemplate = require("./index.handlebars");

    $(function() {

        let googleMaps = null;

        loadGoogleMapsApi({
            key: 'My api key here'
        }).then(function(_googleMaps) {
            googleMaps = _googleMaps
            var autocomplete = new googleMaps.places.Autocomplete($("#address")[0]);

                googleMaps.event.addListener(autocomplete, 'place_changed', function() {
                    var place = autocomplete.getPlace();
                    console.log(place.address_components);
            });
        });

完整列表在这里。

https://github.com/bryandellinger/addressvalidator

如果您想在下载后运行它 npm install npm run build（执行 webpack 构建） npm run start（启动精简服务器并在端口 3000 上打开浏览器）

Answer 1

您需要加载 places 库；根据文档：

loadGoogleMapsApi({
    libraries: ['places'],
    key: '...'
})
.then(function (googleMaps) {
  ...
})
.catch(function (error) {
    ...
});

Answer 2

我遇到了同样的问题，但是当我将类“pac-input”添加到我的<input>标签时，它开始工作了。

thedude

2022-03-01