图层气泡消失

src/main.js

@@ -19,20 +19,23 @@ import '@/assets/styles/base.scss' // 自定义公共样式
 import '@/assets/iconfont/iconfont.css'; //字体图标
 import '@/assets/iconfont/iconfont.js'; //字体图标
 import '@/assets/styles/font.scss';//字体引入
-// 图片上传组件
-import ImageUpload from "@/components/ImageUpload"
 // 字典数据组件
 import DictData from '@/components/DictData'
 
+// 图片上传组件
+import ImageUpload from "@/components/ImageUpload"
 import './assets/icons' // icon
 import './permission' // permission control
 
 //DataV动效组件
 import dataV from '@jiaminghi/data-view'
 
-//公共过滤器
-import './filters'
+//全局混入 mixin
+import {mixinMapTip} from './mixin'
+Vue.mixin(mixinMapTip);
 
+//公共过滤器 
+import './filters'
 // //WebSocket封装方法
 // import * as socketApi from '@/api/socket'
 // Vue.prototype.socketApi = socketApi
@@ -41,12 +44,13 @@ Vue.prototype.$axios = axios
 Vue.config.productionTip = false
 Vue.prototype.selectDictLabel = selectDictLabel
 Vue.prototype.selectDictLabels = selectDictLabels
-Vue.component('ImageUpload', ImageUpload)
+
 Vue.use(ElementUI)
 Vue.use(VueCookies)
 Vue.use(directive)
 Vue.use(plugins)
 Vue.use(dataV)
+Vue.component('ImageUpload', ImageUpload)
 Vue.prototype.$echarts = echarts //挂载echarts
 DictData.install()
 

src/mixin.js

@@ -0,0 +1,21 @@
+// 全局混入map上的tip气泡点击除地图外的区域也进行隐藏
+export const mixinMapTip = {
+    mounted() {
+        this.$nextTick(() => {
+            this.closedMapTip();
+        })       
+    },
+    methods: {
+        closedMapTip() {
+            if(this.$refs.supermap){
+                document.addEventListener("click", (e) => {
+                    let a = this.$refs.supermap.$el;
+                    if (this.$refs.supermap.mapshow && !a.contains(e.target)) {
+                        this.$refs.supermap.mapshow = false;
+                    }
+                });
+            }
+          
+        },
+    }   
+}