Vuejs v-on：mouseover 无法显示菜单答案

【问题标题】：Vuejs v-on:mouseover not working to show menuVuejs v-on：mouseover 无法显示菜单
【发布时间】：2020-01-14 06:20:45
【问题描述】：

当我将鼠标放在 LI 标记上时，我正在尝试显示一个菜单。

当我使用时，它适用于一个简单的变量

@mouseover="hoverFormsControls=true" @mouseleave="hoverFormsControls=false"

这是可行的，但是当我更改为数组时，就像这样

@mouseover="hovers[0]=true" @mouseleave="hovers[0]=false"

它不再起作用了。

变量hoverFormsControls以false开头这个数组（悬停）以所有位置为假开始。

我希望，当我将鼠标悬停在该元素上时，他的子元素将可见，但它不适用于数组，只能用于变量。

【问题讨论】：

【解决方案1】：

这是reactivity caveat，所以你应该这样做：

 @mouseover="$set(hovers,0,true)" @mouseleave="$set(hovers,0,false)"

【讨论】：