vue+elementUI+高德地图模糊查询带出省市县

 

 

 

1. 想通过选点以后反带入到省市县，以前的逻辑是可以通过地图选点带入
2. 以下内容为我修改后的，需要注意的我会提示出来，

3.   v-if="mapShow"> //加这个的目的是为了每次进入地图页面都进行初始化，不加的话会导致只加载一次，再次进入路径不变的问题

                   

                 

4. 其中精华部分在 snameSearch中

5. snameSearch() {

           let me=this;//这样定义上面的省市县才可以拿到值

           if (AMap.event && me.snameAuto) {

             me.snameAutoListener = AMap.event.addListener(me.snameAuto, "select", (e) => {

               if (e.poi.location && e.poi.location.getLat()) {

                 console.log(e)

                 console.log(me.address)

                 me.orderForm.slat = e.poi.location.lat;

                 me.orderForm.slon = e.poi.location.lng;

                 me.orderForm.sname = e.poi.name;

                 me.address=e.poi.district+e.poi.name;//目的是为了点击地图的时候能讲坐标点带入

           

    

               //实例化Geocoder 目的是解析当前的省市县信息

               var geocoder = new AMap.Geocoder({

                   city: ""

               });

    

               var lnglatXY=[e.poi.location.lng, e.poi.location.lat];//地图上所标点的坐标

               geocoder.getAddress(lnglatXY, function(status, result) {

    

                   if (status === 'complete' && result.info === 'OK') {

                       //获得了有效的地址信息:

                       //即，result.regeocode.formattedAddress

    

                     me.cityName=result.regeocode.addressComponent.city

                     me.provinceName=result.regeocode.addressComponent.province

                     me.countyName=result.regeocode.addressComponent.district

    

                       /* alert(city)

                       alert(province) */

                   }else{

                       var city = '获取失败';

                   }

               });

               } else {

                  console.log("2")

                 me.geocoder(e.poi.name, "sname");

               }

             }); 

    

           }

         },

6. 以下代码为写的完整的，有需要的可以看一下

7. regist.vue

8.       mapUtils.vue

9.