vue中我要鼠标移入一个按钮时,一个隐藏的div显示出来
时间: 2023-06-12 13:07:09 浏览: 217
鼠标经过显示隐藏div
5星 · 资源好评率100%
你可以使用Vue的事件绑定和条件渲染来实现这个功能。
首先,在按钮上绑定鼠标移入事件:
```
<button @mouseover="showDiv">Hover Me</button>
```
然后在Vue的data中定义一个变量来控制隐藏的div是否显示:
```
data() {
return {
isDivVisible: false
}
}
```
接着,在methods中定义showDiv方法,该方法将isDivVisible变量设置为true:
```
methods: {
showDiv() {
this.isDivVisible = true
}
}
```
最后,在HTML中根据isDivVisible的值来决定是否显示隐藏的div:
```
<div v-if="isDivVisible">Hidden Div</div>
```
阅读全文