vue在element-ui的dialog弹出框中加入百度地图

参考：https://blog.csdn.net/u012724595/article/details/82703579vue

<!-- gps弹窗 -->
    <el-dialog v-dialogDrag width="500px" title="Gps位置" :visible.sync="dialogFormGps">
      <template>
        <baidu-map class="bm-view" :center="center" :zoom="zoom" :scroll-wheel-zoom="true" ak="填本身申请的ak" ref="myMap" @ready="mapReady" @click="getClickInfo">
          <bm-scale></bm-scale>
        </baidu-map>
      </template>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="dialogFormGps = false">关 闭</el-button>
        <!-- <el-button type="primary" @click="addData('pojoForm')">确 定</el-button> -->
      </div>
    </el-dialog>

import { BaiduMap, BmScale, BmNavigation, BmOverviewMap, BmCityList, BmMarker, BmControl, BmView, BmAutoComplete, BmLocalSearch } from "vue-baidu-map";

方法： git

// 百度地图方法
    // 当选择项发生变化时会触发该事件
 handleSelectionChange(val) { var i = 0, valLen = val.length; if (valLen == 0) { this.locData.ids = 0; } else { for (i; i < valLen; i++) { if (i == 0) { this.locData.ids = val[i].id; } else if (i > 0) { this.locData.ids += "," + val[i].id; } } } }, // 当某一行被点击时会触发该事件 参数：row, event, column
 getRowData(editEqu, event, column) { this.$refs.equTable.toggleRowSelection(editEqu); }, // 设置定位弹出框
 setLoc(formName) { if (this.locData.ids == 0) { this.$message({ message: '请选中装备后再设置定位', type: 'warning' }); } else { this.locDialog = true; map.clearOverlays(); } }, // 百度地图
 mapReady ({BMap, map}) { this.center.lng = 116.404; this.center.lat = 39.915; this.zoom = 15; window.map = map;   //将map变量存储在全局
 }, // 地图点击事件
 getClickInfo (e) { map.clearOverlays(); var myMarker = new BMap.Marker(new BMap.Point(e.point.lng, e.point.lat)); map.addOverlay(myMarker); this.locData.longitude = e.point.lng; this.locData.latitude = e.point.lat; }, // 设置定位确认
 locSubmit(formName) { if (this.locData.longitude == "") { addOper.$message({ message: '请单击地图设置定位后再提交', type: 'warning' }); } else { // 向后台提交locData数据
 } this.locDialog = false; }, // 设置定位取消
 locCancle(formName) { map.clearOverlays(); this.locDialog = false; } }