Merge pull request #16228 from ant-design/drawer-afterVisibleChange

feat: Drawer after visible change

components/drawer/index.en-US.md

@@ -35,6 +35,7 @@ A Drawer is a panel that is typically overlaid on top of a page and slides in fr
 | zIndex | The `z-index` of the Drawer. | Number | 1000 |
 | placement | The placement of the Drawer. | 'top'  \| 'right' \| 'bottom' \| 'left' | 'right' |
 | onClose | Specify a callback that will be called when a user clicks mask, close button or Cancel button. | function(e) | - |
+| afterVisibleChange | Callback after the animation ends when switching drawers. | function(visible) | - |
 
 <style>
 #_hj_feedback_container {

components/drawer/index.tsx

@@ -36,6 +36,7 @@ export interface DrawerProps {
   push?: boolean;
   placement?: placementType;
   onClose?: (e: EventType) => void;
+  afterVisibleChange?: (visible: boolean) => void;
   className?: string;
   handler?: React.ReactNode;
 }
@@ -65,6 +66,7 @@ class Drawer extends React.Component<DrawerProps & ConfigConsumerProps, IDrawerS
     prefixCls: PropTypes.string,
     placement: PropTypes.oneOf(PlacementTypes),
     onClose: PropTypes.func,
+    afterVisibleChange: PropTypes.func,
     className: PropTypes.string,
   };
 

components/drawer/index.zh-CN.md

@@ -34,6 +34,7 @@ title: Drawer
 | zIndex | 设置 Drawer 的 `z-index` | Number | 1000 |
 | placement | 抽屉的方向 | 'top'  \| 'right' \| 'bottom' \| 'left' | 'right'
 | onClose | 点击遮罩层或右上角叉或取消按钮的回调 | function(e) | 无 |
+| afterVisibleChange | 切换抽屉时动画结束后的回调 | function(visible) | 无 |
 
 <style>
 #_hj_feedback_container {

package.json

@@ -66,7 +66,7 @@
     "rc-checkbox": "~2.1.5",
     "rc-collapse": "~1.11.1",
     "rc-dialog": "~7.3.0",
-    "rc-drawer": "~1.7.6",
+    "rc-drawer": "~1.8.0",
     "rc-dropdown": "~2.4.1",
     "rc-editor-mention": "^1.1.7",
     "rc-form": "^2.4.0",