vue3 简单引用-百度地图（setup语法糖中）

1.最外一层的index中引入（没有密匙先去申请认证）

    <script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&type=webgl&ak=您的密钥"></script>

2.模板中创建div盒子，你要放置的位置

<div class="baidu" ref="mapBaidu"></div>

3.script中复制以下代码

<script setup>
import { onMounted,ref} from 'vue';
  const mapBaidu=ref()
  onMounted(()=>{
    var map = new BMapGL.Map(mapBaidu.value);          // 创建地图实例 
    var point = new BMapGL.Point(116.404, 39.915);  // 创建点坐标 
    map.centerAndZoom(point, 15);                 // 初始化地图，设置中心点坐标和地图级别
  })
</script>

4.按需求设置宽高

.baidu {
    width: 100%;
    height: 250px;
  }

5.注意

1. 这段代码已