1.新建map.js
//注意，这个文件需要你添加自己百度地图的ak
export const BaiduMap = {
init: function() { const BMapURL = 'https://api.map.baidu.com/api?v=3.0&ak=' + AK + '&s=1&callback=onBMapCallback'returnnewPromise((resolve, reject) => {
// 如果已加载直接返回if(typeofBMap !== 'undefined') {
resolve(BMap)
returntrue }
// 百度地图异步加载回调处理window.onBMapCallback =function() {
console.log('百度地图脚本初始化成功...')
resolve(BMap)
};
// 插入script脚本let scriptNode = document.createElement('script')
scriptNode.setAttribute('type', 'text/javascript')
scriptNode.setAttribute('src', BMapURL)
document.body.appendChild(scriptNode)
})
}
}
2.在引用的组件中引入map.js
import { BaiduMap} from '@/common/js/map.js';
3.div包裹引用
<template>
<div>
<div id="allmap" ref="allmap" style="height: 100vh; width: 100vw"></div>
</div>
</template>
