首先在html中需要有一个实例对象元素
<div id="mapDiv"></div>
然后在data中定义三个变量用于存储地图实例和经纬度
data（）{
map:null,
currentLng:116.4,
currentLat:39.9,
}
初始化天地图
initMap(){
//初始化地图对象
if(!this.map){ //此判断因为map实例会被重复创建所以需要使用最新实例（这一判断其实我之前也想过，因为我是需要显示在dialog弹窗中，在取消关闭弹窗的时候将map变量实例置空，但再次打开弹窗，实际效果并未拿到最新实例，并且地图无法拖动，结果请求大佬之后才知道需要此判断）
var marker; //如果不加此判断，每次打开地图地图实例和覆盖物会被重复创建，会造成页面覆盖物重复并且地图无法拖动问题（因为鄙人使用是在element dialog框中，所以每次打开需重复创建实例，直接显示在页面中好像不会出现问题，各位可自行尝试）
var zoom = 16;
this.map = new T.Map("mapDiv");
}
this.map.clearOverLays(); // 清除地图中的覆盖物（因为实例和覆盖物会被重复创建最新的，所以在最新的生成前需要清除掉之前的）
//设置显示地图的中心点和级别
this.map.centerAndZoom(new T.LngLat(this.currentLng, this.currentLat), zoom);
var point = new T.LngLat(this.currentLng,this.currentLat);
marker = new T.Marker(point);// 创建标注
this.map.addOverLay(marker); // 将标注添加到地图中
marker.enableDragging(); // 可拖拽
marker.addEventListener("dragend",this.dragMarker) //此处为覆盖物添加拖拽事件，更多事件参照官网http://lbs.tianditu.gov.cn/api/js4.0/class.html
},
监听拖拽事件
dragMarker(e){
var current = e.target
if(current instanceof T.Marker){
console.log(current.getLngLat().lng) //拖拽完后获取到经纬度之后你就可以开始自己的业务逻辑操作了
console.log(current.getLngLat().lat)
}else{
console.log("无法获取该坐标位置");
}
},
重点来了！！！↓ ↓ ↓
当我们调用地图时需要使用
setTimeout做延迟
getMap() {
setTimeout(()=>{
this.initMap()
},100)
},
鄙解（鄙人理解）：因为业务需要，需要将地图显示在弹窗中，elment diaplog的原理是通过v-if来实现的，需要重复的创建删除节点，当打开弹窗的一瞬间就调用地图实例，但弹窗中的dom元素还未生成，所以未获取到dom实例。
上面只是个人理解，对错未知，如有大佬懂之，并为之纠错，吾谢之！！