diff --git a/components/dropdown/demo/event.vue b/components/dropdown/demo/event.vue
index 0d2c8575ed..ba14936411 100644
--- a/components/dropdown/demo/event.vue
+++ b/components/dropdown/demo/event.vue
@@ -17,7 +17,7 @@ An event will be triggered when you click menu items, in which you can make diff
 </docs>
 
 <template>
-  <a-dropdown>
+  <a-dropdown @visible-change="handleVisibleChange">
     <a class="ant-dropdown-link" @click.prevent>
       Hover me, Click menu item
       <DownOutlined />
@@ -44,8 +44,12 @@ export default defineComponent({
     const onClick: MenuProps['onClick'] = ({ key }) => {
       console.log(`Click on item ${key}`);
     };
+    const handleVisibleChange = (value: boolean) => {
+      console.log('visible', value);
+    };
     return {
       onClick,
+      handleVisibleChange,
     };
   },
 });
diff --git a/components/vc-dropdown/Dropdown.tsx b/components/vc-dropdown/Dropdown.tsx
index 03f2bed98b..e335eb21b0 100644
--- a/components/vc-dropdown/Dropdown.tsx
+++ b/components/vc-dropdown/Dropdown.tsx
@@ -51,11 +51,12 @@ export default defineComponent({
     });
 
     const onClick = (e: MouseEvent) => {
+      if (triggerVisible.value !== props.visible) {
+        emit('visibleChange', props.visible === undefined ? !triggerVisible.value : props.visible);
+      }
       if (props.visible === undefined) {
         triggerVisible.value = false;
       }
-
-      emit('visibleChange', false);
       emit('overlayClick', e);
     };