1.回去百度地圖的key(金鑰)

獲取Key的地址：https://lbs.amap.com/api/webservice/guide/create-project/get-key

2.拿到金鑰後，在public下的index.html檔案中引入script

externals: {
   
 
'BMap': 'BMap',
}

3.2 在public下的index.html 增加一個script標籤

<script>
      window.BMap = BMap;
</script>

在元件中使用Bmap 物件時 需要加上window

否則會報錯： BMap is not defined

3.3

4.在元件中使用百度地圖API, 下面是例項

/*
     * 根據經緯度解析地址名稱
     * @parameter1 lng 傳入的經度
     * @parameter2 lat 傳入的緯度
     */
    var BMap = window.BMap;
    
 
var map = new BMap.Map('allmap');
    const map_click = (lng, lat, index) => {
        var point = new BMap.Point(lng, lat);
        map.centerAndZoom(point, 12);
        var geoc = new BMap.Geocoder('allmap');
        geoc.getLocation(point, rs => {
            var addComp = rs.addressComponents;
            let location 
 
= addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;

            document.getElementsByClassName('location')[index] &&
                (document.getElementsByClassName('location')[index].innerHTML = isUndefined(location)
                    ? '無'
                    : location);
        });
    };

var map = new BMap.Map("address"); // 建立Map例項

map.Geocoder('allmap')百度地圖的逆地址解析，首先必須宣告

map.Point(lng,lat); //座標點轉換為百度座標點

map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); // 初始化地圖,設定中心點座標和地圖級別

map.addControl(new BMap.MapTypeControl()); //新增地圖型別控制元件

map.setCurrentCity("北京"); // 設定地圖顯示的城市 此項是必須設定的

在需要展示地址的地方呼叫它。

//引數解析

 //@parameter1 lng 傳入的經度
 //@parameter2 lat 傳入的緯度
 //@index  索引（這裡是迴圈遍歷的）

6.示例demo