diff --git a/components/button/button-group.tsx b/components/button/button-group.tsx
index f263733d6..7f36c1e83 100644
--- a/components/button/button-group.tsx
+++ b/components/button/button-group.tsx
@@ -34,6 +34,9 @@ export default defineComponent({
         case 'small':
           sizeCls = 'sm';
           break;
+        case 'middle':
+        case undefined:
+          break;
         default:
           // eslint-disable-next-line no-console
           console.warn(new UnreachableException(size).error);
diff --git a/components/dropdown/__tests__/__snapshots__/demo.test.js.snap b/components/dropdown/__tests__/__snapshots__/demo.test.js.snap
index c39b69e88..8ca45e165 100644
--- a/components/dropdown/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/dropdown/__tests__/__snapshots__/demo.test.js.snap
@@ -9,20 +9,20 @@ exports[`renders ./components/dropdown/demo/context-menu.vue correctly 1`] = `
 
 exports[`renders ./components/dropdown/demo/dropdown-button.vue correctly 1`] = `
 <div class="demo-dropdown-wrap">
-  <div class="ant-btn-group ant-dropdown-button"><button class="ant-btn ant-btn-default" type="button">
+  <div class="ant-btn-group ant-dropdown-button"><button class="ant-btn" type="button">
       <!----><span>Dropdown</span>
     </button>
-    <!----><button class="ant-btn ant-btn-default ant-dropdown-trigger ant-btn-icon-only" type="button"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
+    <!----><button class="ant-btn ant-dropdown-trigger ant-btn-icon-only" type="button"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
   </div>
-  <div class="ant-btn-group ant-dropdown-button"><button class="ant-btn ant-btn-default" type="button">
+  <div class="ant-btn-group ant-dropdown-button"><button class="ant-btn" type="button">
       <!----><span>Dropdown</span>
     </button>
-    <!----><button class="ant-btn ant-btn-default ant-dropdown-trigger ant-btn-icon-only" type="button"><span role="img" aria-label="user" class="anticon anticon-user"><svg focusable="false" class="" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></span></button>
+    <!----><button class="ant-btn ant-dropdown-trigger ant-btn-icon-only" type="button"><span role="img" aria-label="user" class="anticon anticon-user"><svg focusable="false" class="" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M858.5 763.6a374 374 0 00-80.6-119.5 375.63 375.63 0 00-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 00-80.6 119.5A371.7 371.7 0 00136 901.8a8 8 0 008 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 008-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></span></button>
   </div>
-  <div class="ant-btn-group ant-dropdown-button"><button disabled="" class="ant-btn ant-btn-default" type="button">
+  <div class="ant-btn-group ant-dropdown-button"><button disabled="" class="ant-btn" type="button">
       <!----><span>Dropdown</span>
     </button>
-    <!----><button class="ant-btn ant-btn-default ant-dropdown-trigger ant-btn-icon-only" disabled="" type="button"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
+    <!----><button class="ant-btn ant-dropdown-trigger ant-btn-icon-only" disabled="" type="button"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
   </div>
   <!----><button class="ant-btn ant-dropdown-trigger" type="button">
     <!----><span>Button</span><span role="img" aria-label="down" class="anticon anticon-down"><svg focusable="false" class="" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></span>
@@ -34,6 +34,39 @@ exports[`renders ./components/dropdown/demo/event.vue correctly 1`] = `<!----><a
 
 exports[`renders ./components/dropdown/demo/item.vue correctly 1`] = `<!----><a class="ant-dropdown-link ant-dropdown-trigger"> Hover me <span role="img" aria-label="down" class="anticon anticon-down"><svg focusable="false" class="" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></span></a>`;
 
+exports[`renders ./components/dropdown/demo/loading.vue correctly 1`] = `
+<div class="ant-space ant-space-vertical">
+  <div class="ant-space-item" style="margin-bottom: 8px;">
+    <div class="ant-btn-group ant-dropdown-button"><button class="ant-btn ant-btn-primary ant-btn-loading" type="button"><span role="img" aria-label="loading" class="anticon anticon-loading"><svg focusable="false" class="anticon-spin" data-icon="loading" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="0 0 1024 1024"><path d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"></path></svg></span><span>Submit</span></button>
+      <!----><button class="ant-btn ant-btn-primary ant-dropdown-trigger ant-btn-icon-only" type="button"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
+    </div>
+  </div>
+  <!---->
+  <div class="ant-space-item" style="margin-bottom: 8px;">
+    <div class="ant-btn-group ant-btn-group-sm ant-dropdown-button"><button class="ant-btn ant-btn-primary ant-btn-loading" type="button"><span role="img" aria-label="loading" class="anticon anticon-loading"><svg focusable="false" class="anticon-spin" data-icon="loading" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="0 0 1024 1024"><path d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"></path></svg></span><span>Submit</span></button>
+      <!----><button class="ant-btn ant-btn-primary ant-dropdown-trigger ant-btn-icon-only" type="button"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
+    </div>
+  </div>
+  <!---->
+  <div class="ant-space-item" style="margin-bottom: 8px;">
+    <div class="ant-btn-group ant-dropdown-button"><button class="ant-btn ant-btn-primary" type="button">
+        <!----><span>Submit</span>
+      </button>
+      <!----><button class="ant-btn ant-btn-primary ant-dropdown-trigger ant-btn-icon-only" type="button"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
+    </div>
+  </div>
+  <!---->
+  <div class="ant-space-item">
+    <div class="ant-btn-group ant-dropdown-button"><button class="ant-btn" type="button">
+        <!----><span>Submit</span>
+      </button>
+      <!----><button class="ant-btn ant-dropdown-trigger ant-btn-icon-only" type="button"><span role="img" aria-label="down" class="anticon anticon-down"><svg focusable="false" class="" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></span></button>
+    </div>
+  </div>
+  <!---->
+</div>
+`;
+
 exports[`renders ./components/dropdown/demo/overlay-visible.vue correctly 1`] = `<!----><a class="ant-dropdown-link ant-dropdown-trigger"> Hover me <span role="img" aria-label="down" class="anticon anticon-down"><svg focusable="false" class="" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></span></a>`;
 
 exports[`renders ./components/dropdown/demo/placement.vue correctly 1`] = `
diff --git a/components/dropdown/__tests__/__snapshots__/dropdown-button.test.js.snap b/components/dropdown/__tests__/__snapshots__/dropdown-button.test.js.snap
index 03689ae34..0a11a1643 100644
--- a/components/dropdown/__tests__/__snapshots__/dropdown-button.test.js.snap
+++ b/components/dropdown/__tests__/__snapshots__/dropdown-button.test.js.snap
@@ -1,9 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`DropdownButton should support href like Button 1`] = `
-<div class="ant-btn-group ant-dropdown-button"><a class="ant-btn ant-btn-default" href="https://ant.design">
+<div class="ant-btn-group ant-dropdown-button"><a class="ant-btn" href="https://ant.design">
     <!---->
   </a>
-  <!----><button class="ant-btn ant-btn-default ant-dropdown-trigger ant-btn-icon-only" type="button"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
+  <!----><button class="ant-btn ant-dropdown-trigger ant-btn-icon-only" type="button"><span role="img" aria-label="ellipsis" class="anticon anticon-ellipsis"><svg focusable="false" class="" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z"></path></svg></span></button>
 </div>
 `;
diff --git a/components/dropdown/demo/index.vue b/components/dropdown/demo/index.vue
index 503cbce1b..599dd86d0 100644
--- a/components/dropdown/demo/index.vue
+++ b/components/dropdown/demo/index.vue
@@ -9,6 +9,7 @@
     <placement />
     <sub-menu />
     <trigger />
+    <loadingVue />
   </demo-sort>
 </template>
 
@@ -25,11 +26,13 @@ import OverlayVisible from './overlay-visible.vue';
 import Placement from './placement.vue';
 import SubMenu from './sub-menu.vue';
 import Trigger from './trigger.vue';
+import loadingVue from './loading.vue';
 
 export default defineComponent({
   CN,
   US,
   components: {
+    loadingVue,
     Basic,
     ContextMenu,
     DropdownButton,
diff --git a/components/dropdown/demo/loading.vue b/components/dropdown/demo/loading.vue
new file mode 100644
index 000000000..30cbb6d7d
--- /dev/null
+++ b/components/dropdown/demo/loading.vue
@@ -0,0 +1,86 @@
+<docs>
+---
+order: 9
+title:
+  zh-CN: 加载中状态
+  en-US: Loading
+---
+
+## zh-CN
+
+添加 `loading` 属性即可让按钮处于加载状态，最后两个按钮演示点击后进入加载状态。
+
+## en-US
+
+A loading indicator can be added to a button by setting the `loading` property on the `a-dropdown-button`.
+
+
+</docs>
+
+<template>
+  <a-space direction="vertical">
+    <a-dropdown-button type="primary" loading>
+      <template #overlay>
+        <a-menu>
+          <a-menu-item key="1">Submit and continue</a-menu-item>
+        </a-menu>
+      </template>
+      Submit
+    </a-dropdown-button>
+    <a-dropdown-button type="primary" size="small" loading>
+      <template #overlay>
+        <a-menu>
+          <a-menu-item key="1">Submit and continue</a-menu-item>
+        </a-menu>
+      </template>
+      Submit
+    </a-dropdown-button>
+    <a-dropdown-button type="primary" :loading="loading1" @click="enterLoading1">
+      <template #overlay>
+        <a-menu>
+          <a-menu-item key="1">Submit and continue</a-menu-item>
+        </a-menu>
+      </template>
+      Submit
+    </a-dropdown-button>
+    <a-dropdown-button :loading="loading2" @click="enterLoading2">
+      Submit
+      <template #overlay>
+        <a-menu>
+          <a-menu-item key="1">Submit and continue</a-menu-item>
+        </a-menu>
+      </template>
+      <template #icon><DownOutlined /></template>
+    </a-dropdown-button>
+  </a-space>
+</template>
+<script lang="ts">
+import { defineComponent, Ref, ref } from 'vue';
+import { DownOutlined } from '@ant-design/icons-vue';
+
+export default defineComponent({
+  components: {
+    DownOutlined,
+  },
+  setup() {
+    const loading1 = ref(false);
+    const loading2 = ref(false);
+    const enterLoading = (loading: Ref<boolean>) => {
+      loading.value = true;
+      setTimeout(() => {
+        loading.value = false;
+      }, 6000);
+    };
+    return {
+      loading1,
+      loading2,
+      enterLoading1() {
+        enterLoading(loading1);
+      },
+      enterLoading2() {
+        enterLoading(loading2);
+      },
+    };
+  },
+});
+</script>
diff --git a/components/dropdown/dropdown-button.tsx b/components/dropdown/dropdown-button.tsx
index ec0a3b457..d4b0c4da6 100644
--- a/components/dropdown/dropdown-button.tsx
+++ b/components/dropdown/dropdown-button.tsx
@@ -32,8 +32,9 @@ export default defineComponent({
 
     return () => {
       const {
-        type,
+        type = 'default',
         disabled,
+        loading,
         htmlType,
         class: className = '',
         overlay = slots.overlay?.(),
@@ -47,6 +48,9 @@ export default defineComponent({
         icon = slots.icon?.() || <EllipsisOutlined />,
         mouseEnterDelay,
         mouseLeaveDelay,
+        overlayClassName,
+        overlayStyle,
+        destroyPopupOnHide,
         onClick,
         'onUpdate:visible': _updateVisible,
         ...restProps
@@ -62,12 +66,16 @@ export default defineComponent({
         mouseEnterDelay,
         mouseLeaveDelay,
         visible,
+        overlayClassName,
+        overlayStyle,
+        destroyPopupOnHide,
       };
 
       const leftButton = (
         <Button
           type={type}
           disabled={disabled}
+          loading={loading}
           onClick={onClick}
           htmlType={htmlType}
           href={href}
diff --git a/components/dropdown/index.en-US.md b/components/dropdown/index.en-US.md
index 8bde2fbd6..5db7431a8 100644
--- a/components/dropdown/index.en-US.md
+++ b/components/dropdown/index.en-US.md
@@ -16,8 +16,9 @@ When there are more than a few options to choose from, you can wrap them in a `D
 ### Dropdown
 
 | Property | Description | Type | Default |
-| --- | --- | --- | --- |
+| --- | --- | --- | --- | --- |
 | disabled | whether the dropdown menu is disabled | boolean | - |
+| destroyPopupOnHide | Whether destroy dropdown when hidden | boolean | false |  |
 | getPopupContainer | to set the container of the dropdown menu. The default is to create a `div` element in `body`, you can reset it to the scrolling area and make a relative reposition. [example](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | `() => document.body` |
 | overlay(v-slot) | the dropdown menu | [Menu](/components/menu) | - |
 | overlayClassName | Class name of the dropdown root element | string | - |
@@ -30,7 +31,7 @@ When there are more than a few options to choose from, you can wrap them in a `D
 
 | Events Name | Description | Arguments |
 | --- | --- | --- |
-| visibleChange | a callback function takes an argument: `visible`, is executed when the visible state is changed | function(visible) |
+| visibleChange | a callback function takes an argument: `visible`, is executed when the visible state is changed. Not trigger when hidden by click item | function(visible) |
 
 You should use [Menu](/components/menu/) as `overlay`. The menu items and dividers are also available by using `Menu.Item` and `Menu.Divider`.
 
@@ -43,6 +44,7 @@ You should use [Menu](/components/menu/) as `overlay`. The menu items and divide
 | Property | Description | Type | Default | Version |
 | --- | --- | --- | --- | --- |
 | disabled | whether the dropdown menu is disabled | boolean | - |  |
+| loading | Set the loading status of button | boolean \| { delay: number } | false | 3.0 |
 | icon | Icon (appears on the right) | vNode \| slot | - | 1.5.0 |
 | overlay(v-slot) | the dropdown menu | [Menu](/components/menu) | - |  |
 | placement | placement of pop menu: `bottomLeft` `bottomCenter` `bottomRight` `topLeft` `topCenter` `topRight` | String | `bottomLeft` |  |
@@ -56,4 +58,4 @@ You should use [Menu](/components/menu/) as `overlay`. The menu items and divide
 | Events Name | Description | Arguments |
 | --- | --- | --- |
 | click | a callback function, the same as [Button](/components/button), which will be executed when you click the button on the left | Function |
-| visibleChange | a callback function takes an argument: `visible`, is executed when the visible state is changed | Function |
+| visibleChange | a callback function takes an argument: `visible`, is executed when the visible state is changed. Not trigger when hidden by click item | Function |
diff --git a/components/dropdown/index.zh-CN.md b/components/dropdown/index.zh-CN.md
index b447d3b33..0f5c73269 100644
--- a/components/dropdown/index.zh-CN.md
+++ b/components/dropdown/index.zh-CN.md
@@ -20,8 +20,9 @@ cover: https://gw.alipayobjects.com/zos/alicdn/eedWN59yJ/Dropdown.svg
 属性如下
 
 | 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
+| --- | --- | --- | --- | --- |
 | disabled | 菜单是否禁用 | boolean | - |
+| destroyPopupOnHide | 关闭后是否销毁 Dropdown | boolean | false | 3.0 |
 | getPopupContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。 | Function(triggerNode) | `() => document.body` |
 | overlay(v-slot) | 菜单 | [Menu](/components/menu-cn) | - |
 | overlayClassName | 下拉根元素的类名称 | string | - |
@@ -38,15 +39,16 @@ cover: https://gw.alipayobjects.com/zos/alicdn/eedWN59yJ/Dropdown.svg
 
 ### 事件
 
-| 事件名称      | 说明                                   | 回调参数          |
-| ------------- | -------------------------------------- | ----------------- |
-| visibleChange | 菜单显示状态改变时调用，参数为 visible | function(visible) |
+| 事件名称 | 说明 | 回调参数 |
+| --- | --- | --- |
+| visibleChange | 菜单显示状态改变时调用，参数为 visible。。点击菜单按钮导致的消失不会触发 | function(visible) |
 
 ### Dropdown.Button
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
 | disabled | 菜单是否禁用 | boolean | - |  |
+| loading | 设置按钮载入状态 | boolean \| { delay: number } | false | 3.0 |
 | icon | 右侧的 icon | VNode \| slot | - | 1.5.0 |
 | overlay(v-slot) | 菜单 | [Menu](/components/menu-cn/) | - |  |
 | placement | 菜单弹出位置：`bottomLeft` `bottomCenter` `bottomRight` `topLeft` `topCenter` `topRight` | String | `bottomLeft` |  |
@@ -57,7 +59,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/eedWN59yJ/Dropdown.svg
 
 ### Dropdown.Button 事件
 
-| 事件名称      | 说明                                                         | 回调参数          |
-| ------------- | ------------------------------------------------------------ | ----------------- |
-| click         | 点击左侧按钮的回调，和 [Button](/components/button-cn/) 一致 | Function          |
-| visibleChange | 菜单显示状态改变时调用，参数为 visible                       | function(visible) |
+| 事件名称 | 说明 | 回调参数 |
+| --- | --- | --- |
+| click | 点击左侧按钮的回调，和 [Button](/components/button-cn/) 一致 | Function |
+| visibleChange | 菜单显示状态改变时调用，参数为 visible。。点击菜单按钮导致的消失不会触发 | function(visible) |
diff --git a/components/dropdown/props.ts b/components/dropdown/props.ts
index d792cb243..df796e2b5 100644
--- a/components/dropdown/props.ts
+++ b/components/dropdown/props.ts
@@ -41,6 +41,7 @@ const dropdownProps = () => ({
   mouseLeaveDelay: PropTypes.number,
   openClassName: PropTypes.string,
   minOverlayWidthMatchTrigger: PropTypes.looseBool,
+  destroyPopupOnHide: PropTypes.looseBool,
   onVisibleChange: {
     type: Function as PropType<(val: boolean) => void>,
   },
@@ -49,17 +50,18 @@ const dropdownProps = () => ({
   },
 });
 
-const ButtonTypesProps = buttonTypes();
+const buttonTypesProps = buttonTypes();
 const dropdownButtonProps = () => ({
   ...dropdownProps(),
-  type: ButtonTypesProps.type,
+  type: buttonTypesProps.type,
   size: PropTypes.oneOf(tuple('small', 'large')),
-  htmlType: ButtonTypesProps.htmlType,
+  htmlType: buttonTypesProps.htmlType,
   href: PropTypes.string,
   disabled: PropTypes.looseBool,
   prefixCls: PropTypes.string,
   icon: PropTypes.any,
   title: PropTypes.string,
+  loading: buttonTypesProps.loading,
   onClick: {
     type: Function as PropType<MouseEventHandler>,
   },
diff --git a/components/dropdown/style/index.less b/components/dropdown/style/index.less
index 7a241d83b..bb6044792 100644
--- a/components/dropdown/style/index.less
+++ b/components/dropdown/style/index.less
@@ -80,19 +80,19 @@
   &-placement-topLeft > &-arrow,
   &-placement-topRight > &-arrow {
     bottom: @popover-distance - @popover-arrow-width + 2.2px;
-    border-top-color: transparent;
-    border-right-color: @popover-bg;
-    border-bottom-color: @popover-bg;
-    border-left-color: transparent;
+    border-color: transparent @popover-bg @popover-bg transparent;
     box-shadow: 3px 3px 7px fade(@black, 7%);
   }
+
   &-placement-topCenter > &-arrow {
     left: 50%;
     transform: translateX(-50%) rotate(45deg);
   }
+
   &-placement-topLeft > &-arrow {
     left: 16px;
   }
+
   &-placement-topRight > &-arrow {
     right: 16px;
   }
@@ -101,19 +101,19 @@
   &-placement-bottomLeft > &-arrow,
   &-placement-bottomRight > &-arrow {
     top: @popover-distance - @popover-arrow-width + 2px;
-    border-top-color: @popover-bg;
-    border-right-color: transparent;
-    border-bottom-color: transparent;
-    border-left-color: @popover-bg;
+    border-color: @popover-bg transparent transparent @popover-bg;
     box-shadow: -2px -2px 5px fade(@black, 6%);
   }
+
   &-placement-bottomCenter > &-arrow {
     left: 50%;
     transform: translateX(-50%) rotate(45deg);
   }
+
   &-placement-bottomLeft > &-arrow {
     left: 16px;
   }
+
   &-placement-bottomRight > &-arrow {
     right: 16px;
   }
@@ -341,10 +341,21 @@
 .@{dropdown-prefix-cls}-button {
   white-space: nowrap;
 
-  &.@{ant-prefix}-btn-group
-    > .@{ant-prefix}-btn:last-child:not(:first-child):not(.@{ant-prefix}-btn-icon-only) {
-    padding-right: @padding-xs;
-    padding-left: @padding-xs;
+  &.@{ant-prefix}-btn-group > .@{ant-prefix}-btn {
+    &-loading,
+    &-loading + .@{ant-prefix}-btn {
+      cursor: default;
+      pointer-events: none;
+    }
+
+    &-loading + .@{ant-prefix}-btn::before {
+      display: block;
+    }
+
+    &:last-child:not(:first-child):not(.@{ant-prefix}-btn-icon-only) {
+      padding-right: @padding-xs;
+      padding-left: @padding-xs;
+    }
   }
 }
 
@@ -362,6 +373,7 @@
     .@{dropdown-prefix-cls}-menu-submenu-arrow::after {
       color: @text-color-secondary-dark;
     }
+
     &:hover {
       color: @text-color-inverse;
       background: transparent;
diff --git a/components/dropdown/style/rtl.less b/components/dropdown/style/rtl.less
index 22ef31a0c..8d77d8301 100644
--- a/components/dropdown/style/rtl.less
+++ b/components/dropdown/style/rtl.less
@@ -22,7 +22,8 @@
     }
 
     &-item-group-title {
-      .@{dropdown-prefix-cls}-rtl & {
+      .@{dropdown-prefix-cls}-rtl &,
+      .@{dropdown-prefix-cls}-menu-submenu-rtl & {
         direction: rtl;
         text-align: right;
       }
@@ -55,13 +56,13 @@
         }
       }
 
-      .@{dropdown-prefix-cls}-menu-submenu-arrow {
+      .@{dropdown-prefix-cls}-menu-submenu-expand-icon {
         .@{dropdown-prefix-cls}-rtl & {
           right: auto;
           left: @padding-xs;
         }
 
-        &-icon {
+        .@{dropdown-prefix-cls}-menu-submenu-arrow-icon {
           .@{dropdown-prefix-cls}-rtl & {
             margin-left: 0 !important;
             transform: scaleX(-1);
diff --git a/components/dropdown/style/status.less b/components/dropdown/style/status.less
index 327cf488a..e370a8722 100644
--- a/components/dropdown/style/status.less
+++ b/components/dropdown/style/status.less
@@ -1,4 +1,6 @@
-@import './index';
+@import (reference) '../../style/themes/index';
+
+@dropdown-prefix-cls: ~'@{ant-prefix}-dropdown';
 
 .@{dropdown-prefix-cls}-menu-item {
   &&-danger {