vue引入百度地图出现返回不加载地图的情况

Question

代码如下：

methods: {
    createMap (BMap) {
      let map = new BMap.Map('allmap')
      let point = new BMap.Point(120.127401, 30.288469)
      map.centerAndZoom(point, 18)   // 初始化地图,设置中心点坐标和地图级别
      var myGeo = new BMap.Geocoder()
      // 将地址解析结果显示在地图上,并调整地图视野
      myGeo.getPoint('杭州市西湖区文二路391号', function (point) {
        if (point) {
          map.centerAndZoom(point, 18)
        } else {
          console.log('您选择地址没有解析到结果!')
        }
      }, '杭州市')
    }
  },
  mounted () {
    let that = this
    window.BMap_loadScriptTime = (new Date()).getTime()
    const oScript = document.createElement('script')
    oScript.src = 'http://api.map.baidu.com/getscript?v=2.0&ak=PNhhMFEMvIgiZ8LO09zFNeBd3pHtnM7r&services=&t=20170511202040'
    oScript.type = 'text/javascript'
    document.head.appendChild(oScript)
    window.onload = function () {
      that.$nextTick(
        that.createMap(this.BMap)
      )
    }
  }

Answer 1

将window.onload改成oScript.onload

Answer 2

window.onload = function () { that.$nextTick( that.createMap(this.BMap) ) }

改成

 that.$nextTick( that.createMap(this.BMap) )；

Answer 3

你可以把mounted里面的$nextTick方法 直接结合到 createMap方法里面，就是把

createMap(){
console.info("准备调用百度地图api....")
this.$nextTick(
     function () {
     //生成地图的代码写在这里面即可，例如：
        var map = new BMap.Map("allmap");// HTML代码中的地图容器ID：<div id="allmap"></div>
        var geolocation = new BMap.Geolocation();

        var point = new BMap.Point(116.331398, 39.897445);
        map.centerAndZoom(point, 12); // 中心点
     
     
     }

)

}