vue当中的鼠标事件

Vue中常用的鼠标事件有以下几种：

1. @click：点击事件，当元素被点击时触发。

2. @dblclick：双击事件，当元素被双击时触发。

3. @mousedown：鼠标按下事件，当鼠标按下时触发。

4. @mouseup：鼠标松开事件，当鼠标松开时触发。

5. @mousemove：鼠标移动事件，当鼠标在元素上移动时触发。

6. @mouseover：鼠标移入事件，当鼠标移入元素时触发。

7. @mouseout：鼠标移出事件，当鼠标移出元素时触发。

8. @mouseenter：鼠标进入事件，当鼠标进入元素时触发。

9. @mouseleave：鼠标离开事件，当鼠标离开元素时触发。

下面是一个示例代码，演示了如何在Vue中使用鼠标事件：

<template>
  <div>
    <button @click="handleClick">点击我</button>
    <div @mouseover="handleMouseOver" @mouseleave="handleMouseLeave">鼠标移入移出</div>
  </div>
</template>

<script>
export default {
  methods: {
    handleClick() {
      console.log('点击了按钮')
    },
    handleMouseOver() {
      console.log('鼠标移入了元素')
    },
    handleMouseLeave() {
      console.log('鼠标移出了元素')
    }
  }
}
</script>