# 优化信息窗体逻辑

src/views/counter/map2.vue

@@ -66,6 +66,7 @@ export default {
           title: item.title,
           map: this.map
         })
+        const infoWindow = this.instantiateInforWindow(item.title)
         AMap.event.addListener(marker, 'click', () => {
           infoWindow.open(this.map, marker.getPosition())
         })
@@ -75,17 +76,6 @@ export default {
         this.map.addControl(new AMap.ToolBar())
         this.map.addControl(new AMap.Scale())
       })
-      // 实例化信息窗体
-      const title = '方恒假日酒店<span style="font-size:11px;color:#F00;">价格:318</span>'
-      const content = []
-      content.push("<img src='http://tpc.googlesyndication.com/simgad/5843493769827749134'>地址：北京市朝阳区阜通东大街6号院3号楼东北8.3公里")
-      content.push('电话：010-64733333')
-      content.push("<a href='https://ditu.amap.com/detail/B000A8URXB?citycode=110105'>详细信息</a>")
-      const infoWindow = new AMap.InfoWindow({
-        isCustom: true,
-        content: this.createInfoWindow(title, content.join('<br/>')),
-        offset: new AMap.Pixel(16, -45)
-      })
     },
     createInfoWindow(title, content) {
       const info = document.createElement('div')
@@ -125,6 +115,19 @@ export default {
       info.appendChild(bottom)
       return info
     },
+    instantiateInforWindow(title) {
+      const content = []
+      content.push("<img src='http://tpc.googlesyndication.com/simgad/5843493769827749134'>地址：北京市朝阳区阜通东大街6号院3号楼东北8.3公里")
+      content.push('电话：010-64733333')
+      content.push("<a href='https://ditu.amap.com/detail/B000A8URXB?citycode=110105'>详细信息</a>")
+      const infoWindow = new AMap.InfoWindow({
+        isCustom: true,
+        closeWhenClickMap: true,
+        content: this.createInfoWindow(title, content.join('<br/>')),
+        offset: new AMap.Pixel(16, -45)
+      })
+      return infoWindow
+    },
     closeInfoWindow() {
       this.map.clearInfoWindow()
     }