From 791783344ac8d5cd96354c5a8e8f0c7e061ab5d5 Mon Sep 17 00:00:00 2001
From: tangjinzhou <415800467@qq.com>
Date: Thu, 4 Apr 2019 23:28:50 +0800
Subject: [PATCH] feat: add custom handle

---
 components/drawer/index.en-US.md   | 1 +
 components/drawer/index.jsx        | 4 +++-
 components/drawer/index.zh-CN.md   | 3 ++-
 components/vc-drawer/src/Drawer.js | 4 ++--
 4 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/components/drawer/index.en-US.md b/components/drawer/index.en-US.md
index a944b2e94..87ba67625 100644
--- a/components/drawer/index.en-US.md
+++ b/components/drawer/index.en-US.md
@@ -16,6 +16,7 @@
 | height | placement is `top` or `bottom`, height of the Drawer dialog. | string\|number | - |
 | zIndex | The `z-index` of the Drawer. | Number | 1000 |
 | placement | The placement of the Drawer. | 'top'  \| 'right' \| 'bottom' \| 'left' | 'right' |
+| handle | After setting, the drawer is directly mounted on the DOM, and you can control the drawer to open or close through this `handle`. | VNode \| slot | - |
 
 
 ## Methods
diff --git a/components/drawer/index.jsx b/components/drawer/index.jsx
index ffcbb6513..56c7f959a 100644
--- a/components/drawer/index.jsx
+++ b/components/drawer/index.jsx
@@ -24,6 +24,7 @@ const Drawer = {
     placement: PropTypes.oneOf(['top', 'right', 'bottom', 'left']).def('right'),
     level: PropTypes.any.def(null),
     wrapClassName: PropTypes.string, // not use class like react, vue will add class to root dom
+    handle: PropTypes.any,
   },
   mixins: [BaseMixin],
   data() {
@@ -181,10 +182,11 @@ const Drawer = {
     } else {
       offsetStyle.height = typeof height === 'number' ? `${height}px` : height;
     }
+    const handler = getComponentFromProp(this, 'handle') || false;
     const vcDrawerProps = {
       props: {
-        handler: false,
         ...rest,
+        handler,
         ...offsetStyle,
         open: visible,
         showMask: props.mask,
diff --git a/components/drawer/index.zh-CN.md b/components/drawer/index.zh-CN.md
index c0885d2fc..1d01962ea 100644
--- a/components/drawer/index.zh-CN.md
+++ b/components/drawer/index.zh-CN.md
@@ -15,7 +15,8 @@
 | width | 宽度 | string \| number | 256 |
 | height | 高度, 在 `placement` 为 `top` 或 `bottom` 时使用 | string \| number | 256 |
 | zIndex | 设置 Drawer 的 `z-index` | Number | 1000 |
-| placement | 抽屉的方向 | 'top'  \| 'right' \| 'bottom' \| 'left' | 'right'
+| placement | 抽屉的方向 | 'top'  \| 'right' \| 'bottom' \| 'left' | 'right'|
+| handle | 设置后抽屉直接挂载到DOM上，你可以通过该handle控制抽屉打开关闭 | VNode \| slot | - |
 
 ## 方法
 
diff --git a/components/vc-drawer/src/Drawer.js b/components/vc-drawer/src/Drawer.js
index f91f8dc2b..8b67797bb 100644
--- a/components/vc-drawer/src/Drawer.js
+++ b/components/vc-drawer/src/Drawer.js
@@ -408,8 +408,8 @@ const Drawer = {
             <i class="drawer-handle-icon" />
           </div>
         );
-        const { handler: handlerSlot } = this.$slots;
-        const handlerSlotVnode = handlerSlot || handlerDefalut;
+        const { handler: handlerSlot } = this;
+        const handlerSlotVnode = (handlerSlot && handlerSlot[0]) || handlerDefalut;
         const { click: handleIconClick } = getEvents(handlerSlotVnode);
         handlerChildren = cloneElement(handlerSlotVnode, {
           on: {