vue使用鼠標移入移出事件通過增加類名的方式改變樣式

1. 在需要設置樣式的標簽上綁定鼠標移入移出事件

<span
    class="preview"
    @mouseover="mouseOver($event)"
    @mouseleave="mouseLeave($event)"
    @click="previewClick(scope.row)"
    >點擊預覽</span
>

2. 在methods中定義事件

//點擊預覽鼠標懸停事件
mouseOver($event) {
    $event.currentTarget.className = 'preview active'
},
mouseLeave($event) {
    $event.currentTarget.className = 'preview'
},

3. 定義鼠標懸停時的樣式

.active {
    color: #409eff;
}