鼠标悬停时打开可点击的v菜单

时间:2020-07-08 05:22:03

标签: vue.js vuetify.js

Vuetify v-menu具有open-on-hover属性。

使用此功能,用户可以使用鼠标悬停使用菜单,而无需单击。

单击鼠标悬停此菜单将关闭。

我要设置具有可选隐藏区域的菜单。

所以,我需要一个悬停菜单可以单击而不关闭。

有什么办法吗?

先谢谢您

这是我的示例代码。

<v-menu open-on-hover>
  <template v-slot:activator="{ on }">
    <span>hover menu</span> 
  </template>
<!-- v-menu content -->
  <v-card>
    <v-btn @click="hiddenarea = true">open</v-btn>
<!-- hiddenarea -->     
    <span v-if="hiddenarea">Here is hidden area</span>
  </v-card>
</v-menu>

Menu Component -Vuetify.js

1 个答案:

答案 0 :(得分:0)

您可以为此使用close-on-content-click

<v-menu open-on-hover :close-on-content-click="false">