解決鼠標mouseenter和mouseleave來回閃爍問題

1. 寫久了UI組件封裝的web項目，再去寫常規的無UI組件的後臺管理系統，真是添磚加瓦都得自己寫。
   在實際運用中，鼠標事件會有很多的觸發異常效果在裏面，比如今天要說的鼠標經過、移開事件，我習慣用mouseenter 和
   mouseleave這兩個。

2.在下面這段html代碼中需求時，當鼠標經過該div service-status後，出現一段消息信息框。

 <div class="service-status"  @mouseenter="enter(index)" @mouseleave="leave()">
         <div class="service-badge" :class="item.health==='DOWN'?'badge-red':item.health==='WARNING'?'badge-yellow':'badge-green'">
         </div>
</div>

這裏對閃爍問題進行了減緩，即點擊穿透時出現對閃爍再經過延遲後不會這麼明顯了

 enter = function (param_index) {
       $(".service-hover").finish();
          setTimeout(function () {
              $("#service-hover"+param_index).addClass("display");
          },300);

      };
   leave = function () {
         setTimeout(function () {
             $(".service-hover").finish().removeClass('display');

         },500);
     };