在Vue中,当鼠标移入元素时,可以通过绑定@mouseover
事件来触发相应的方法,该方法可以通过修改数据来改变元素的背景图片。同样地,当鼠标移出元素时,可以绑定@mouseout
事件触发另一个方法,该方法也可以通过修改数据来切换回原来的背景图片。
例如,假设我们有一个div
元素,它绑定了一个backgroundImage
属性来控制背景图片的显示,我们可以像下面这样编写代码来实现上述功能:
<template>
<div
class="my-div"
:style="{backgroundImage: bgImage}"
@mous