"ant-design-vue": "^3.2.20"
a-menu-item需要key
如果不加key,点击时会影响其他item
悬浮菜单
如果Menu直接作为悬浮菜单出现,v-show和v-if会有所不同
<a-menu v-if="menuProp.visible" :style="menuProp.style" class="custom-menu">
<a-menu-item @click="downloadVideo" key="downloadVideo">
<img class="icon-img" src="/@/assets/Icons/download.png" />
下载
</a-menu-item>
<a-menu-item @click="removeTag" key="removeTag">
<img class="icon-img" src="/@/assets/Icons/remove.png" />
删除
</a-menu-item>
<a-menu-item
key="handleCreateNewTag"
:style="{backgroundColor:menuProp.customTagVisible ? '#28282C' : '',color:menuProp.initStyle ? '#ffffff':''}"
@mouseover="showCustomTag"
@mouseleave="closeCustomTag"
@click="handleCreateNewTag"
>
<img class="icon-img" src="/@/assets/Icons/custom_tag.png" />
<span style="margin: 0 20px 0 0;">自定义标签</span>
<right-outlined />
</a-menu-item>
</a-menu>
使用v-show点击某项item后,会变蓝,关闭再次打开后点击过的依旧变蓝。而v-if不会
如果还是会出现,使用手动样式覆盖
同时可以利用这个bug,对于某些需求使用v-show,再次打开会显示上次点击过的item