- 地图添加一个v-if 开关控制加载
<template
<div class="app-container">
<baidu-map
v-if="hackReset"
class="map-view"
:center="center"
:zoom="12"
@ready="handlerhistory"
style="height: 800px"
>
<div v-if="points.length > 1">
<bm-label
:content="points[0].name"
:position="{ lng: points[0].lng, lat: points[0].lat }"
:labelStyle="style"
:offset="{ width: -15, height: -15 }"
title="测试"
/>
<bm-label
:content="points[points.length - 1].name"
:position="{
lng: points[points.length - 1].lng,
lat: points[points.length - 1].lat,
}"
:labelStyle="style"
:offset="{ width: -15, height: -15 }"
title="测试"
/>
<bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-navigation>
<bm-polyline
:path="points"
stroke-color="#F25C05"
:stroke-opacity="0.7"
:stroke-weight="5"
></bm-polyline>
</div>
</baidu-map>
</div>
<template>
- data 写一个hackReset变量控制地图开关默认开
hackReset: true,
- 利用侦听器,侦听标注数组points变化,调接口有数据就是有需要标注信息,就控制地图开关刷新
watch: {
points: {
handler(newValue, oldValue) {
this.hackReset = false
this.$nextTick(() => {
this.hackReset = true
})
}
}
},