vue项目直接引入百度地图

前一个博客中关于后台管理的搭建使用了百度地图，这里简单记录一下如何使用

前期准备：

•     如果使用v1.5之后的版本需要百度ak，需要本人去申请。地址传送门：http://lbsyun.baidu.com/apiconsole/key

        登陆>控制台>创建应用

• 搭建一个vue-cli；具体不在阐述。

地图引入：

首先在index.html 入口文件引入百度地图js。使用1.5以下不需要ak

<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=自己申请的ak"></script>

然后在对应的页面中复制以下代码：

js:

  mounted() {
    var map = new BMap.Map("l-map");
    map.enableScrollWheelZoom(); //启用滚轮放大缩小，默认禁用
    map.enableContinuousZoom(); //启用地图惯性拖拽，默认禁用
    map.centerAndZoom("北京", 12); // 初始化地图,设置城市和地图级别。
  },

html:

<div id="l-map" style="height:300px"></div>