高德地图使用

解释:高德地图的使用方法,无封装的组件

使用地图组件需要先到 高德地图官网 创建应用获取 Key ,然后可以在 App.vue 中全局配置:

1.引入插件

import EleMapPicker from 'ele-admin-pro/packages/ele-map-picker';

2.注册

components: {  EleMapPicker},

3.使用
     



    
   
  


 
  
     
    

     addressFlag:0,
    //1.控制地图显示隐藏
      visibles: false,

   //这个点击获取地址传参,根据值不同回显不同的输入框
    addressChange(addressFlag){
      console.log(addressFlag);
      this.addressFlag=addressFlag;
      this.visibles=true;
    },

 onDone(result) {
      if(this.addressFlag == 0){
          this.form.address = result.city.province + result.city.district + result.address+result.name;
      }else{
      this.form.insuredAddress = result.city.province + result.city.district + result.address+result.name;
      }

      this.visibles = false;
    },

直接使用地图





高德地图使用_第1张图片

实现地图轨迹会放

 





高德地图使用_第2张图片

 

你可能感兴趣的:(javascript,elementui,webview)