超简单!图解Vue的四个v-on:mouse触发机制及区别

四个v-on:mouse分别是:mouseenter(进入)、mouseover(逗留)、mouseout(暂离)、mouseleave(离开)
书写格式:
① v-on:mouseenter=“执行命令”
② @mouseenter=“执行命令”

一张图说明一切!

超简单!图解Vue的四个v-on:mouse触发机制及区别
以父DIV为主元素,则

进父DIV时,触发mouseenter和mouseover
在父DIV逗留,一直触发mouseover
进父DIV中的子DIV时,触发mouseout
出子DIV时,触发mouseover,即在父DIV逗留
出父DIV,触发mouseleave,离开父DIV