背景如下:在Vue3下使用ant-design组件库中的a-drop-down,将官网源码贴过来自己代码运行后没有显示出相应的菜单项
<template>
<a-dropdown>
<a class="ant-dropdown-link" @click="e => e.preventDefault()">
Hover me, Click menu item <a-icon type="down" />
</a>
<a-menu slot="overlay">
<a-menu-item key="1">item1</a-menu-item>
<a-menu-item key="2">item2</a-menu-item>
</a-menu>
</a-dropdown>
</template>
通过查阅,发现这是Vue2中的写法,在Vue3中已经无效,在Vue3中正确写法应如下。去除slot插槽改用<template #ovelay>
<template>
<a-dropdown>
<a class="ant-dropdown-link" @click="e => e.preventDefault()">
Hover me, Click menu item <a-icon type="down" />
</a>
<template #overlay>
<a-menu>
<a-menu-item key="1">item1</a-menu-item>
<a-menu-item key="2">item2</a-menu-item>
</a-menu>
</template>
</a-dropdown>
</template>