VUE之使用百度地圖API

     利用vue創建點餐系統，在點餐系統中需要知道商家地址信息，這時就需要借用百度地圖API。

    步驟一：申請百度地圖密鑰；

    步驟二：在index.html中添加百度地圖JavaScript API接口；

  <script  type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=KCzp8claYra8uYAvahElV9oKUT6j7Gx1" ></script>

    步驟三：在webpack.base.conf.js配置文件中配置BMap，在module.exports 中與entry平級；

 externals: {
    "BMap": "BMap"
  }

    步驟四：在地圖組件中import BMap，否則會出現"BMap undefined"；

import BMap from 'BMap';

    步驟五：創建地圖對象，在mounted生命周期調用；

mounted() {
      this.ready();
  },
  methods: {
    ready: function() {
      var map = new BMap.Map('allmap');
      var point = new BMap.Point(104.075796, 30.659684);
      map.centerAndZoom(point, 14);
      map.addControl(new BMap.MapTypeControl());
      map.enableScrollWheelZoom(true);
      map.enableDoubleClickZoom(true);
      var marker = new BMap.Marker(point);
      map.addOverlay(marker);
    }
  }

    步驟六：將組件插入父組件中；