在vue项目中使用百度地图获取当前城市

第一步在index.html中引入

<script src="http://api.map.baidu.com/api?v=2.0&ak=你自己的访问应用(AK)"></script>

第二步 在公共文件里面创建一个getUserLocation.js,文件内容如下:

//百度地图获取城市名称的方法
let getCurrentCityName = function () {
    return new Promise(function (resolve, reject) {
        let myCity = new BMap.LocalCity()
        myCity.get(function (result) {
            resolve(result.name)
        })
    })
}
export default getCurrentCityName

第三步 在需要的vue文件内使用

import getCurrentCityName from 'common/js/getUserLocation'
method: {
    //通过百度地图获取当前城市
        getCurrentCity() {
            getCurrentCityName().then((city) => {
              console.log(city);  //顺利的话能在控制台打印出当前城市
            })
        }
}

mounted(){
       this.getCurrentCity()
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容