白度

<template>
<div style="display:flex;height:10%;justify-content:center;margin-item:center;">
<span style="">用户的位置：</span><span>{{form.address}}</span>
</div>
<div id="baidu" style="with:100%;height:90%;"></div>
</template>
<script>
// import loadBMap from "../js/loadBMap"
import { onBeforeUnmount, onMounted, reactive } from '@vue/runtime-core'
export default {
setup(){
// const BMap=window.Bmap;
const form=reactive({
address: '', // 详细地址
addrPoint: { // 详细地址经纬度
lng: 0,
lat: 0
}
});
const BMap = window.BMap;
var map=reactive(null);
var timer=reactive(null);
var point=reactive(null);
var point1 = new BMap.Point(113.04141752378935,28.2529969151191)

onMounted( ()=>{
initMap();
})
const initMap=()=>{
map=new BMap.Map("baidu");
point=new BMap.Point(113.05072721717, 28.240762138389);
map.centerAndZoom(point, 19);
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
var geolocation=new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
console.log(r.point);
point=new BMap.Point(r.point.lng,r.point.lat);
// mk = new BMap.Marker(r.point);
// map.addOverlay(mk);//标出所在地
// map.panTo(r.point);
// if(this.)
})
var driving = new BMap.DrivingRoute(map, {renderOptions:{map:map, autoViewport: true}});
driving.search(point, point1);
getAddrByPoint(point1);
timer=setInterval(() => {
setTimeout(()=>{
geolocation.getCurrentPosition(function(r){
console.log(r.point);
point=new BMap.Point(r.point.lng,r.point.lat);
// mk = new BMap.Marker(r.point);
// map.addOverlay(mk);//标出所在地
// map.panTo(r.point);
// if(this.)
})
driving.search(point, point1);
getAddrByPoint(point1);

})
}, 6000);
};

const getAddrByPoint=(point)=> {
var geco = new BMap.Geocoder()
geco.getLocation(point, function(res) {
form.address=res.address;
form.point=point;
})
}
onBeforeUnmount(()=>{
clearInterval(timer);
})

return{
form,

}
}

}
</script>
<style scoped>

</style>