console
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html{width: 100%;height: 100%;margin:0;font-family:"微软雅黑";font-size:14px;}
#allmap {width:100%;height:500px;}
</style>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=CXG067O9s1bTB2u8Mks8tLF1d5Vufet8"></script>
<title>逆地址解析</title>
</head>
<body>
<div id="app">
<ul>
<li v-for="item in listData">{{item.site}}</li>
</ul>
<p>{{listData}}</p>
</div>
</body>
</html>
<script type="text/javascript">
new Vue({
el: '#app',
data: {
seen: true,
ok: true,
index:{},
listData:[],
address:[],
},
mounted(){
this.getData();
},
methods:{
getAddress(index){
let that=this;
let arr=[]
for(let i=0;i<index.length;i++){
var geoc = new BMap.Geocoder()
var point = new BMap.Point(index[i].lastLoc.lon, index[i].lastLoc.lat)
geoc.getLocation(point, (rs) => {
var addComp = rs.addressComponents
var site = rs.address
index[i].site = site
arr.push(site);
if(i==index.length-1){
that.address=arr;
console.log(that.address,index.length-1)
that.listData=index;
}
})
}
},
getData(){
let index={"total":19,"warnNum":10,"totalNum":17,"totalPage":4,"dataList":[{"id":62,"IMEI":"363620190322518","equipmentName":"ssss","equipmentPic":"http://wwmimgs.oss-cn-shenzhen.aliyuncs.com/gps/2019-07-03/%E5%A4%B4%E5%B0%96.jpg","classDeptId":"23","className":"一班一年级","gradeDeptId":"222","gradeDeptName":"阳光小学-一年级","schoolDeptId":"22","schoolDeptName":"阳光小学","equipmentStatusName":"在线","lastTime":1562137852040,"lastLoc":{"lat":24.871097,"lon":118.633266,"type":1},"power":100,"sign":85,"type":1},{"id":61,"IMEI":"123","equipmentName":"单蒸蟹","classDeptId":"1f18784cdac145d48cd771e49060e2c1","className":"二班六年级","gradeDeptId":"349270c1b44146f1a712b4d22cfac868","gradeDeptName":"测试学校-六年级","schoolDeptId":"c74f883616614526a43fd417b92588a4","schoolDeptName":"测试学校","equipmentStatusName":"在线","lastTime":1562137851986,"lastLoc":{"lat":24.889754,"lon":118.635773,"type":1},"power":100,"sign":85,"type":1},{"id":60,"IMEI":"32432424","equipmentName":"123423","classDeptId":"1f18784cdac145d48cd771e49060e2c1","className":"二班六年级","gradeDeptId":"349270c1b44146f1a712b4d22cfac868","gradeDeptName":"测试学校-六年级","schoolDeptId":"c74f883616614526a43fd417b92588a4","schoolDeptName":"测试学校","equipmentStatusName":"在线","lastTime":1562137851898,"lastLoc":{"lat":24.897325,"lon":118.639468,"type":1},"power":100,"sign":85,"type":1},{"id":59,"IMEI":"899484","equipmentName":"北京烤鸭","equipmentPic":"http://wwmimgs.oss-cn-shenzhen.aliyuncs.com/gps/2019-07-01/6eaee96fb458521a09684685b9315977.jpg","classDeptId":"24","className":"二班一年级","gradeDeptId":"222","gradeDeptName":"阳光小学-一年级","schoolDeptId":"22","schoolDeptName":"阳光小学","equipmentStatusName":"在线","lastTime":1562137851764,"lastLoc":{"lat":24.881143,"lon":118.631824,"type":1},"power":100,"sign":85,"type":1},{"id":58,"IMEI":"2345677","equipmentName":"水煮活鱼","equipmentPic":"","classDeptId":"23","className":"一班一年级","gradeDeptId":"222","gradeDeptName":"阳光小学-一年级","schoolDeptId":"22","schoolDeptName":"阳光小学","equipmentStatusName":"在线","lastTime":1562137851611,"lastLoc":{"lat":24.891423,"lon":118.627536,"type":1},"power":100,"sign":85,"type":1}],"outNum":1,"pageSize":5,"page":1,"onlineNum":16};
this.getAddress(index.dataList);
}
}
})
</script>