关于vue3:记录Vue3高德地图自定义弹窗中的事件

·
/*
 1. 弹窗，不要在 content 里定义 html 内容不然所有内容的数据都会是循环的最初一个
 2. 应用 infowindow.setContent(windowPopup); 设置弹窗的模板
*/
infowindow = new AMap.InfoWindow({
    isCustom: true,// 开启自定义弹窗
    //content: contents,
    anchor: "bottom-center",
    offset: new AMap.Pixel(10, -10),
});

/* 
 1. 把外部办法赋值给 window
 2. 把数据的 key 赋值给自定义属性，点击事件时候获取自定义属性的 key 给以后数据
*/
// 弹窗模板
<div class="link_btn"  data-num=${i} onclick="$detailsAction()"> 查看详情 </div>

// 查看详情
window.$detailsAction = function detailsAction() {const num = document.querySelector('.link_btn').getAttribute('data-num')
    const datas = state.pointList[+num]
    getData(datas);
    getVideoCode();
    getEchartsAction();
    state.infowindow.close();
    state.realtime.maxDerail = true;
    state.realtime.minDerail = 1;
}
·

/* 异步加载地图插件 / 地区查问 --  点位聚合 */
AMap.plugin(["AMap.DistrictLayer", "AMap.MarkerClusterer"],()=>{
  let disProvince = new AMap.DistrictLayer.Province({
  zIndex: 12,
  adcode: ["130000"],
  depth: 2,
  styles: {fill: function (properties) {
     let adcode = properties.adcode;
     return getColorByAdcode(adcode);
   },
   "province-stroke": "#09b8bf",
   "city-stroke": "#09b8bf",
   "county-stroke": "#09b8bf", // 线条色彩
   },
 });
  disProvince.setMap(map);      
})

/* 高德地图异步加载 */
export default function MapLoader() {return new Promise((resolve, reject) => {if (window.AMap) {resolve(window.AMap);
     } else {var script = document.createElement("script");
       script.type = "text/javascript";
       script.async = true;
       script.src =
         "http://webapi.amap.com/maps?v=1.4.15&callback=initAMap&key=5df63594d41cda1654066cca8fd5836b&plugin=AMap.Object3DLayer,AMap.DistrictSearch,AMap.Geocoder";
       script.onerror = reject;
       document.head.appendChild(script);
     }
     window.initAMap = () => {resolve(window.AMap);
     };
   });
 }