Use AutoNavi Map in VUE-Get the user's current location

1 Download
npm install vue-amap --save
In the configuration file webpack.base.conf.js, introduce

externals: [
require(‘webpack-require-http’)
],

2 Need to have a container to visit the map (because it is to obtain the current user information, no need to display)
3 Because the project is loaded on demand, it is still introduced
beforeMount() in the beforeMount() hook function { require([ “ https://webapi .amap.com/maps?v=1.4.9&key=The key you applied for ” ], () => { setTimeout(() => {}, 1500); }); },

4 This time the requirement is to click the **'Current Location' button** to obtain the provincial and municipal name of the current city and load the data list

So, register the click event for the'current location' button ,

Initialize the Gaode map
var mapObj = new AMap.Map("iCenter");

//来调官网的api
mapObj.plugin(“AMap.CitySearch”, function() {
var citySearch = new AMap.CitySearch();
citySearch.getLocalCity(function(status, result) {
if (status === “complete” && result.info === “OK”) {

        // 查询成功，result即为当前所在城市信息
        console.log（result）
      }
    });
  });