n-menu, 得到menu-item 的展开状态
在 Naive UI 的 n-menu
组件中,你可以使用 v-model:value
指令来获取或设置被展开的子菜单(如果有的话)。这是一个示例:
<template>
<n-menu v-model:value="openedMenu">
<n-submenu name="submenu1">
<n-menu-item>Option 1</n-menu-item>
<n-menu-item>Option 2</n-menu-item>
</n-submenu>
</n-menu>
<div>Submenu is {{ openedMenu === 'submenu1' ? 'open' : 'closed' }}</div>
</template>
<script>
import { ref } from 'vue';
export default {
setup() {
const openedMenu = ref(null);
return {
openedMenu
};
}
}
</script>
在此示例中,我们创建了一个响应性引用 openedMenu
并使用 v-model:value
将其绑定到 <n-menu>
。当用户打开或关闭子菜单时,openedMenu
将被自动设置为被打开的子菜单的名称。
在模板中,我们根据 openedMenu
是否等于 'submenu1'
来判断子菜单是否已经打开。
注意:具体的属性名称和行为可能因 Naive UI 版本的不同或其他因素而有所变化。如果这段代码不能正常工作,你可能需要查阅你正在使用的 Naive UI 版本的官方文档。