想要获取当前的位置，即可使用vue-amap是基于Vue 2.0和高德地图的地图组件。

使用步骤：

1.安装

    npm install -S vue-amap // 可在package.json查看是否安装
复制代码

2.在入口文件main.js引入

    // 引入高德地图
    // 高德地图组件使用
    import VueAMap from 'vue-amap'
    
    Vue.config.productionTip = false
    Vue.use(VueAMap);
    VueAMap.initAMapApiLoader({
      key: 'your amap key', 
      plugin: [
      'AMap.Autocomplete', 
      'AMap.PlaceSearch', // POI搜索插件
      'AMap.Scale', // 右下角缩略图插件 比例尺
      'AMap.OverView', 
      'AMap.ToolBar', // 地图工具条
      'AMap.MapType', 
      'AMap.PolyEditor', 
      'AMap.CircleEditor',// 圆形编辑器插件
      'AMap.Geolocation'// 定位控件，用来获取和展示用户主机所在的经纬度位置
      ],
      // 默认高德 sdk 版本为 1.4.4
      v: '1.4.4'
    });
复制代码

3.在组件中.vue文件

     <div class="getlocation">定位</div>
     <el-amap vid="amap" :plugin="plugin" class="amap-demo" :center="center"></el-amap>
     <div class="toolbar">
       <span v-if="loaded">location: lng = {{ lng }} lat = {{ lat }}</span>
       <span v-else>正在定位</span>
     </div>
     
     script里面
       export default {
       data() {
         let self = this;
         return {
            center: [121.59996, 31.197646],
            lng: 0, 
            lat: 0,
            loaded: false,
           plugin: [
              {
                pName: "Geolocation", //定位
                events: {
                  init(o) {
                    // o 是高德地图定位插件实例
                    o.getCurrentPosition((status, result) => {
                      if (result && result.position) {
                        console.log(status, result);
                        self.lng = result.position.lng; //设置经度
                        self.lat = result.position.lat; //设置维度
                        self.center = [self.lng, self.lat]; //设置中心坐标
                        self.loaded = true;
                        self.$nextTick();
                      }
                    });
                  }
                }
              }
            ]
         };
       },
       
       
       style里
        .getlocation{
            margin-left:4rem;
            font-size:15px;
            font-weight: 500;
            margin-top:0.3rem;
        }
        .amap-demo {
          height: 15rem;
          margin-top: 0.3rem;
        }
复制代码

这是我在开发中做的获取当前位置的功能，通过vue-amap插件即可获取当前位置的经纬度，基于高德地图定位的定位功能。