Vue uses Amap to realize city positioning

<van-row class="address_item">
  <van-col span="6" class="item-title">Delivery address</van-col>
  <van-col span="18">
  <p class="item">
  <van-icon name="arrow" class="arrow"/>
  <van-icon name="location-o" />
  <span><van-field v-model="mapname" placeholder="Click to select" readonly v-on:click="mapaddress"/></span>
  </p>
  </van-col>
</van-row>

mapaddress(){
   et a=this.$route.query.id
  localStorage.setItem('names',this.names);
  localStorage.setItem('phone',this.phone);
  localStorage.setItem('addressDetail',this.addressDetail);
  localStorage.setItem('postalCode',this.postalCode);
  localStorage.setItem('checked',this.checked);
  this.$router.push({
    path: '/mapLocation',
    query: {id:a,are:this.are}
  })
}

<template>
  <iframe id="getAddress" @load="loadiframe"
    src="https://m.amap.com/picker/?keywords=Office building, community, school&zoom=15&center=&radius=1000&total=20&key=the key you applied for"
    style="width:100%; height:100%;position: absolute;z-index:22222;">
  </iframe>
</template>

loadiframe() {
  let iframe = document.getElementById('getAddress').contentWindow;
  iframe.postMessage('hello', 'https://m.amap.com/picker/');
  window.addEventListener("message", function (e) {
  if (e.data.command != "COMMAND_GET_TITLE") {
  //Implement business code let a=this.$route.query.id
  let are = this.$route.query.are
  let address = e.data.address
  let location = e.data.location
  let name = e.data.name
  this.$router.push({
  path: '/addressFill',
    query: {address:address,location:location,name:name,id:a,are:are}
  })

  }

  }.bind(this), false);
},

localStorage.setItem('names',this.names);
localStorage.setItem('phone',this.phone);
localStorage.setItem('addressDetail',this.addressDetail);
localStorage.setItem('postalCode',this.postalCode);
localStorage.setItem('checked',this.checked);

let addressDetail = localStorage.getItem('addressDetail');

if(addressDetail!=undefined&&addressDetail!=null&&addressDetail!=""){
  this.addressDetail=addressDetail
  localStorage.removeItem("addressDetail");
}else{
  this.addressDetail=""
}