javascript - 无法使用带有 load-google-maps-api-2 的 webpack 读取未定义的属性 'Autocomplete'

Question

我正在尝试使用 maps javascript api place autocomplete 设置自动完成，但我一直收到。

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

索引.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 安装npm run build(做一个 webpack 构建)npm run start(启动精简版服务器并在端口 3000 上打开浏览器)

Answer 1

你需要加载places库；根据documentation :

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