vue+van+百度地图，实现详细地址根据关键字搜索

//address-info：收货人信息初始值

//search-result：详细地址搜索结果 

//show-search-result：是否显示搜索结果

//show-delete：是否显示删除按钮

//save：点击保存按钮时触发

//delete：确认删除地址时触发

//change-area：修改收件地区时触发

//change-detail：修改详细地址时触发

//change-default：切换是否使用默认地址时触发  

  </template> 
  <div style="background:#ffffff;">
    <van-address-edit         
     ref='Address'
    :address-info="editAddress"         

    :area-list="areaList"         

    show-search-result         

    :search-result="searchResult"         

    show-delete        

    @save="onSave"         

    @delete="onDelete"         

    @change-area="onChangeArea"         

    @change-default="onChangeDefault"         

    @change-detail="onChangeDetail"         

    @select-search='onSecectSeach'       />     

    <div id="allmap"></div>

</div> </template>
data() {     
    return {       
        areaList,       
        show: false,       
        addDetail: false,       
        isLoading: false,       
        list: [],       
        editAddress: {},       
        searchResult: [],   
        timer:null
    };   
},
 onChangeArea(val) {
 //修改身份
  this.editAddress.province = val[0].name;
  this.editAddress.city = val[1].name;
  this.editAddress.county = val[2].name;
  this.editAddress.areaCode = val[2].code;
  //清空详情地址数据
  this.editAddress.addressDetail = "";
  this.$refs.Address.setAddressDetail("");
  this.searchResult = [];
},
onChangeDetail(val) { 
//修改详细地址时触发       
    if (val && this.editAddress.province) {        
      //有值
       if(this.timer){
           clearTimeout(this.timer);
          this.timer = null;
       }
       this.timer= setTimeout(() => {           
        this.getAddress(val);         
        }, 1000);       
    }else {         
         clearTimeout(this.timer);
          this.timer = null;
        this.searchResult = [];         
        this.editAddress.addressDetail = "";    
         this.$refs.Address.setAddressDetail("");
    }     
},     
getAddress(val) {       
    //获取当前选择省市区的经纬度 
    var myGeo = new BMap.Geocoder();        
    let that = this; 
    //this.editAddress.province：当前选择的省份 
    //val：详细地址输入的值       
    myGeo.getPoint( val,         
    function (point) {           
        if (point) { 
        //获得当前地区的经纬度             
          **  let map = new BMap.Map("allmap");            
            map.centerAndZoom(new BMap.Point(point.lng, point.lat), 11);             
            that.getSeach(map, val);   **        
        }        
    }, this.editAddress.province);    
},     
getSeach(map, val) {       
//实现关键词搜搜      
    let that = this;       
    var options = {         
    renderOptions: { map: map },         
    onSearchComplete: function (results) {                     
        if (local.getStatus() === BMAP_STATUS_SUCCESS) { 
        //当前搜索出来的信息             
        that.searchResult = [];             
        for (var i = 0; i <= results.getCurrentNumPois(); i++) {               
            let m = results.getPoi(i);               
            if (m)                 
                that.searchResult.push({                   
                name: m.title || "",                   
                address: m.address,                 
            });             
        }           
        } else {             
            Toast("您输入的地址没有解析到结果！");           
        }         
     },       
};      
    var local = new BMap.LocalSearch(map, options);       
    let name = this.editAddress.city + this.editAddress.county + val;       
    local.search(name);     
},     
onSecectSeach(val) { 
    //选中搜索结果时触发       
    this.editAddress.addressDetail = val.address;     
},