ant-design-vue icon indicating copy to clipboard operation
ant-design-vue copied to clipboard

a-menu组件在collapsed折叠的状态下,通过js设置selectedKeys为某个二级菜单时会弹出卡片并选中,但是鼠标不放上面再移走就不会自动消失。

Open romande opened this issue 1 year ago • 2 comments

  • [ ] I have searched the issues of this repository and believe that this is not a duplicate.

Version

4.1.2

Environment

Microsoft Edge122.0.2365.52 (正式版本) (64 位)

Reproduction link

https://www.antdv.com/components/menu-cn#components-menu-demo-inline-collapsed

Steps to reproduce

内嵌菜单,状态缩为缩起时:js里通过设置selectedKeys选中某个二级菜单,二级菜单会以气泡卡片形式弹出并选中菜单。但是气泡卡片会一直停留在页面上。只有鼠标移动到卡片上再移开才会消失。

GIF

动画

代码示例

<a-menu
v-model:selectedKeys="selectedKeys"
mode="inline"
theme="dark"
:inline-collapsed="collapsed"
:items="menus"
@select="menuChoose"
:open-keys="state.openKeys"
@openChange="onOpenChange"
></a-menu>
</a-layout-sider>

// 高亮显示选中的菜单项
const openAndChooseSelectedMenu = (key) => {
// 展开被选中的菜单(这边的写法只支持两层菜单)
menus.value.forEach(m => {
if(m.children && m.children.find(cm => cm.key === key)) {
state.openKeys = [m.key]
}
});
// 选择具体某个菜单项
selectedKeys.value = [key]
}

What is expected?

折叠的情况下,二级菜单弹出并高亮后自动消失。

What is actually happening?

二级菜单弹出选中后,一直停留在页面上。

romande avatar Feb 27 '24 06:02 romande

能否提供一个可复现的最小仓库地址呢?

aShu-guo avatar Mar 05 '24 03:03 aShu-guo

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

github-actions[bot] avatar May 05 '24 02:05 github-actions[bot]

你好,请问你这个问题解决了吗?我也出现这个现象 很烦恼

10187169 avatar May 20 '24 02:05 10187169