错误“未捕获的类型错误:Microsoft.Maps.loadModule 不是函数”

问题描述

我将 Vue.js 与 Vuetify 框架一起使用。我需要使用带有位置地址字段的表单。当用户开始输入地名时,该字段必须建议位置地址列表。

最终目标是实现如下所示: https://www.bing.com/api/maps/sdk/mapcontrol/isdk/autosuggestuiwithoutmap#JS 但是,我收到以下错误TypeError: Microsoft.Maps.loadModule is not a function

 MetaInfo () {
      return {
        script: [{
          src: `https://www.bing.com/api/maps/mapcontrol?key=[bing_map apikey]`,async: true,defer: true,callback: () => this.loadMapScenario() // will declare it in methods
        }]
      }
    },methods: {
    loadMapScenario() {
       Microsoft.Maps.loadModule("Microsoft.Maps.AutoSuggest",{
      callback: () => {
        var options = { maxResults: 5 };
        var manager = new Microsoft.Maps.AutosuggestManager(options);
        manager.attachAutosuggest("#searchBox","#searchBoxContainer");
      },});
    },

解决方法

Bing Maps Web SDK 还会异步加载一堆您必须等待的其他资源。因此,您应该像您指向的示例一样在 URL 中指定回调参数(请参阅 HTML 选项卡中的脚本标记)。这是从样本中提取的标记,请参阅&callback=loadMapScenario

<script type='text/javascript' src='https://www.bing.com/api/maps/mapcontrol?key=YourBingMapsKey&callback=loadMapScenario' async defer></script>