引入vue-clickaway

package.json

@@ -37,6 +37,7 @@
     "randomstring": "^1.1.5",
     "v-fit-columns": "^0.2.0",
     "vue": "^2.6.12",
+    "vue-clickaway": "^2.2.2",
     "vue-infinite-loading": "^2.4.5",
     "vue-waterfall-plugin": "^1.1.0",
     "vuedraggable": "^2.24.2",

src/components/Play.vue

@@ -129,7 +129,7 @@
           <ul v-show="right.type === 'shortcut'" class="list-shortcut">
             <li v-for="(m, n) in right.shortcut" :key="n"><span class="title">{{m.desc}} -- [ {{m.key}} ]</span></li>
           </ul>
-          <ul v-show="right.type === 'other'" class="list-other">
+          <ul v-show="right.type === 'other'" class="list-other" v-on-clickaway="closeListEvent">
             <li v-show="right.other.length === 0">无数据</li>
             <li @click="otherItemEvent(m)" v-for="(m, n) in right.other" :key="n"><span class="title">{{m.name}} - [{{m.site.name}}]</span></li>
           </ul>
@@ -145,6 +145,8 @@ import zy from '../lib/site/tools'
 import Player from 'xgplayer'
 import Hls from 'xgplayer-hls.js'
 import mt from 'mousetrap'
+import { directive as onClickaway } from 'vue-clickaway'
+
 const { remote, ipcRenderer, clipboard } = require('electron')
 
 const VIDEO_DETAIL_CACHE = {}
@@ -247,6 +249,9 @@ export default {
       }
     }
   },
+  directives: {
+    onClickaway: onClickaway
+  },
   computed: {
     view: {
       get () {

src/components/Share.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="share" id="share" @click="shareClickEvent">
+  <div class="share" id="share" @click="shareClickEvent" v-on-clickaway="shareClickEvent">
     <div class="left">
       <img :src="pic" alt="" @load="picLoadEvent">
     </div>
@@ -22,6 +22,7 @@ import { mapMutations } from 'vuex'
 import QrcodeVue from 'qrcode.vue'
 import html2canvas from 'html2canvas'
 import zy from '../lib/site/tools'
+import { directive as onClickaway } from 'vue-clickaway'
 const { clipboard, nativeImage } = require('electron')
 export default {
   name: 'share',
@@ -56,6 +57,9 @@ export default {
       deep: true
     }
   },
+  directives: {
+    onClickaway: onClickaway
+  },
   methods: {
     ...mapMutations(['SET_SHARE']),
     shareClickEvent () {