VUE使用百度地图api获取当前定位城市

VUE使用百度地图API获取当前城市

话不多说手下见真章
在这里插入图片描述
首先就是配置BMap 百度一下一大堆
然后就是正题了
一、在index.html加入script标签
在这里插入图片描述
二、创建一个JS文件
VUE使用百度地图api获取当前定位城市_第1张图片
export default {
init: function (){
const AK = “o491iK2pZE9WAdzi6BBujHwkkhF3qyxY”;
const BMap_URL = “https://api.map.baidu.com/api?v=2.0&ak=”+ AK +"&s=1&callback=onBMapCallback";
return new Promise((resolve, reject) => {
// 如果已加载直接返回
if(typeof BMap !== “undefined”) {
resolve(BMap);
return true;
}
// 百度地图异步加载回调处理
window.onBMapCallback = function () {
resolve(BMap);
};
let getCurrentCityName = function () {
return new Promise(function (resolve, reject) {
let myCity = new BMap.LocalCity()
myCity.get(function (result) {
resolve(result.name)
})
})
}
// 插入script脚本
let scriptNode = document.createElement(“script”);
scriptNode.setAttribute(“type”, “text/javascript”);
scriptNode.setAttribute(“src”, BMap_URL);
document.body.appendChild(scriptNode);
});
}
}
三、在所需要定位的文件中引入
在这里插入图片描述
四、方法
VUE使用百度地图api获取当前定位城市_第2张图片
五、最后就是在mounted中调用就可以了

在这里插入图片描述
六、欢迎大神多来指点一二 略略略

你可能感兴趣的:(vue,百度api,获取当前城市,定位,BMap)