BMap is not defined的问题

巴星华
2023-12-01

最近项目里要用到经纬度,之前用到过,于是写个组件进行引用,但是这次突然出现一个问题就是BMap is not defined,上网查很多,各路大神很多方法最多的便是在通main.js同级建一个map.js

export function MP(ak) {
  return new Promise(function(resolve, reject) {
    window.onload = function() {
      resolve(BMap)
    }
    var script = document.createElement('script')
    script.type = 'text/javascript'
    script.src =
      'http://api.map.baidu.com/api?v=2.0&ak=' + ak + '&callback=init'
    script.onerror = reject
    document.head.appendChild(script)
  })
}

在自己创建的地图组建中进行引入,我建的地图的组件为Map.vue
在Map.vue中进行引入(看好目录)

import { MP } from './../../map.js'
mounted () {
    this.$nextTick(function () {
      var _this = this;
      //写入自己的ak
      MP(_this.ak).then(BMap => {
        //在此调用api
        this.go()//这是我自定义的

      })
    })
  },
   methods: {
   //要传递的经纬度数据
    go () {
      var map = new BMap.Map("allmap")
      var point = new BMap.Point(116.331398, 39.897445)
      map.centerAndZoom(point, 12)
      var geolocation = new BMap.Geolocation()
      let _this = this
      geolocation.getCurrentPosition(function (r) {
        if (this.getStatus() == BMAP_STATUS_SUCCESS) {
          var mk = new BMap.Marker(r.point)
          map.addOverlay(mk)
          map.panTo(r.point)
          // console.log(r.point.lng + ',' + r.point.lat)
          const obj = {
            lng: r.point.lng,
            lat: r.point.lat
          }
          // this.obj = r.point.lng + ',' + r.point.lat
          _this.$emit('fna', obj)
          //return obj
        }
        else {
          alert('failed' + this.getStatus())
        }
      }, { enableHighAccuracy: true })
    }
  }

这样报错信息就会消除

 类似资料: