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;
}