@mouseover和 @mouseleave不应该是鼠标移入移出吗？为什么现在必须点击才能变色？

Question

<template>
  <div>
    <p @mouseover="yr()" @mouseleave="yc()" :style="active">我是文字内容</p>
  </div>
</template>
 
<script>
export default {
  data() {
    return {
      active:''
    }
  },
  methods:{
    yr(){
      this.active="color:blue"
      console.log("进来")
    },
    yc(){
      this.active =''
      console.log("出来")
    }
  }
}
</script>
 
<style>
  p{
    color: red;
  }
</style>

Answer 1

我试了一下没问题啊

https://codepen.io/guyu521/pen/dymMNyO