element-ui的select和popover共存時的問題

問題路徑： https://codepen.io/jiangguangyao/pen/JjEjaYa

問題描述： 在select和popover（click觸發）共存的情況下，打開popover后再點擊select框，popover不會關閉。

   疑問點： popover的click按照效果來看，應該是點擊button打開，點擊popover打開的內容區狀態不變，點擊button和popover之外的地方，會關閉，但和select共存時，當popover打開狀態下，點擊select，popover並未關閉

研究源碼： 經過研究源碼發現，select框是上述描述的狀態，點擊select的input和打開的option都不會關閉（多選情況下），點擊外層則會關閉，是因為有v-clickoutside（自定義指令）

解決思路： 將popover按照源碼select的設計格式進行調整。

解決方案： 

1. 全局注冊自定義指令clickoutside
1. 在js代碼中引入自定義指令  import Clickoutside from 'element-ui/src/utils/clickoutside'   // 從element-ui的依賴中引入　　　　　 
2. 全局注冊  const clickoutside = Vue.directive('clickoutside', Clickoutside)
3. 導出  export default { clickoutside }
4. main.js內使用： 引入當前js，然后在new Vue的對象內添加這個js
2. 使用clickoutside   在需要點擊外側關閉的標簽上寫v-clickoutside='func'，然后在func中寫需要進行的邏輯操作即可

針對當前問題的解決方案： 

　　需考慮的點：點擊popover的reference觸發成功后，點擊彈出區域不關閉，點擊彈出區域外的區域都關閉

　　因此，我們只需在popover內容區加上v-clickoutside即可

　　（因無法引入自定義指令，因此此處暫無demo）