使用Vue來實現鼠標懸停效果

使用Vue來實現鼠標懸停效果。

可以使用事件處理器v-on指令（簡寫爲：@）來完成。

爲標籤綁定mouseenter以及mouseleave事件即可。

<span> 計算機 </span>
<span class="sort-item" @mouseenter="setSortHover"> 全部 </span>
<span class="sort-item" @mouseenter="setSortHover"> 計算機基礎與應用 </span>
<span class="sort-item" @mouseenter="setSortHover"> 網絡安全與技術 </span>
<span class="sort-item" @mouseenter="setSortHover"> 軟件工程 </span>

<script>
	/** 
	 * 這裏是寫在Vue的方法裏面的代碼
     * 設置分類搜索的hover監聽事件
     */
     setSortHover: function () {
          $(".sort-item").hover(function(){
              $(this).css("color","white");
              $(this).addClass("skin-bg")
          }, function(){
              $(this).css("color","#333333");
              $(this).removeClass("skin-bg")
          });
      }
</script>

大概的效果

JQuery的內容參考這個地址：
https://www.runoob.com/jquery/event-hover.html

參考的文章：
https://blog.csdn.net/qq_33270001/article/details/81808738