vue鼠标移入移出改变颜色

可以通过绑定鼠标移入和移出事件来改变元素的样式。例如，在模板中定义一个元素：

<template>
  <div class="box" @mouseover="changeColor(true)" @mouseout="changeColor(false)"></div>
</template>

然后在对应的 Vue 实例中定义 changeColor 函数来修改样式：

<script>
export default {
  methods: {
    changeColor(isEnter) {
      const box = document.querySelector('.box');
      if (isEnter) {
        box.style.backgroundColor = 'red';
      } else {
        box.style.backgroundColor = 'white';
      }
    }
  }
}
</script>

以上代码中，当鼠标移入元素时，changeColor 函数将被调用，并将元素的背景色设置为红色；当鼠标移出元素时，背景色被设置为白色。