vue3使用高德地图API-自定义搜索并加载marker、点击marker显示infoWindow（踩坑日记）

vue3使用高德地图API（踩坑日记）

注意点：
1、marker的显示上：
要么直接在marker的配置项中使用map，要么使用map.add(marker)直接在地图上加，尽量不要两则都用，推荐在配置项指定显示的map
2、各个控件在map中的显示，要么统一用配置项，要么都用map.add(控件实例)，否则会出现错误
代码如下：

/* ************* 地图展示 ************** start ******* */
let AMap = (window as any).AMap;
// 地图实例
let map:any = null;
// 城市
let city: any = ref("成都市");
// 地点搜索
var placeSearch:any = null;
// 地图标点
let markers:any = reactive<any[]>([]);
// 选中的地图标点
let markersActive:any = reactive<any[]>([]);
// 地图上的窗体（详情信息窗体）
var infoWindow:any = null;
/* 高德地图 */
let uploadGDMap = () => {
   
    map = new AMap.Map('container-map', {
   
        resizeEnable: true,
        viewMode: '2D', // 默认使用 2D 模式，如果希望使用带有俯仰角的 3D 模式，请设置 viewMode: '3D'
        zoom: 12, // 初始化地图层级
        // center: [104.06, 30.67] // 初始化地图中心点
    });
    // map.on('complete',()=>{
   
    //     ElMessage.info("加载完成！");
    // })
    // map.setCity(city.value);
    // searchPosition('');
}
/* marker图标点击 */
let markerClick = (e:any)=>{
   
    console.log("marker信息：",e.target.w.extData);
    let poi = e.target.w.extData.poi;
    orgInfo.name = poi.name;
    orgInfo.adress = poi.adress;
    orgInfo.phone = poi.tel;
    loadPoint(e);
}
/* 清空所有的marker 
    all:清除所有的marker
    marker: 清除搜索出来的marker
    markerActive: 清除选中的marker
*/
let clearMarker = (type:'all'|'marker'|'markerActive' = 'all') => {