From 73772536d6314388726a46363ea7b820451b97b7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=A2=81=E7=81=8F?= <admin@aresn.com>
Date: Fri, 11 Nov 2016 18:22:53 +0800
Subject: [PATCH] optimize Slider that sometime Tooltip shaking
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

optimize Slider that sometime Tooltip shaking（add controlled prop in
Tooltip component）
---
 src/components/slider/slider.vue   | 6 +++---
 src/components/tooltip/tooltip.vue | 8 +++++++-
 test/routers/slider.vue            | 2 +-
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/components/slider/slider.vue b/src/components/slider/slider.vue
index ca009a9f..9f394e90 100644
--- a/src/components/slider/slider.vue
+++ b/src/components/slider/slider.vue
@@ -18,7 +18,7 @@
                     :class="[prefixCls + '-button-wrap']"
                     :style="{left: firstPosition + '%'}"
                     @mousedown="onFirstButtonDown">
-                    <Tooltip placement="top" :content="tipFormat(value[0])" :disabled="tipFormat(value[0]) === null" v-ref:tooltip>
+                    <Tooltip :controlled="firstDragging" placement="top" :content="tipFormat(value[0])" :disabled="tipFormat(value[0]) === null" v-ref:tooltip>
                         <div :class="button1Classes"></div>
                     </Tooltip>
                 </div>
@@ -26,7 +26,7 @@
                     :class="[prefixCls + '-button-wrap']"
                     :style="{left: secondPosition + '%'}"
                     @mousedown="onSecondButtonDown">
-                    <Tooltip placement="top" :content="tipFormat(value[1])" :disabled="tipFormat(value[1]) === null" v-ref:tooltip2>
+                    <Tooltip :controlled="secondDragging" placement="top" :content="tipFormat(value[1])" :disabled="tipFormat(value[1]) === null" v-ref:tooltip2>
                         <div :class="button2Classes"></div>
                     </Tooltip>
                 </div>
@@ -36,7 +36,7 @@
                     :class="[prefixCls + '-button-wrap']"
                     :style="{left: singlePosition + '%'}"
                     @mousedown="onSingleButtonDown">
-                    <Tooltip placement="top" :content="tipFormat(value)" :disabled="tipFormat(value) === null" v-ref:tooltip>
+                    <Tooltip :controlled="dragging" placement="top" :content="tipFormat(value)" :disabled="tipFormat(value) === null" v-ref:tooltip>
                         <div :class="buttonClasses"></div>
                     </Tooltip>
                 </div>
diff --git a/src/components/tooltip/tooltip.vue b/src/components/tooltip/tooltip.vue
index adba58f7..dba95486 100644
--- a/src/components/tooltip/tooltip.vue
+++ b/src/components/tooltip/tooltip.vue
@@ -37,6 +37,10 @@
             disabled: {
                 type: Boolean,
                 default: false
+            },
+            controlled: {    // under this prop,Tooltip will not close when mouseleave
+                type: Boolean,
+                default: false
             }
         },
         data () {
@@ -52,7 +56,9 @@
             },
             handleClosePopper() {
                 clearTimeout(this.timeout);
-                this.visible = false;
+                if (!this.controlled) {
+                    this.visible = false;
+                }
             }
         }
     }
diff --git a/test/routers/slider.vue b/test/routers/slider.vue
index 8b057278..451c8bce 100644
--- a/test/routers/slider.vue
+++ b/test/routers/slider.vue
@@ -1,7 +1,7 @@
 <template>
     <div style="width: 400px;margin:100px;">
         {{ value }}
-        <Slider @on-change="change"></Slider>
+        <Slider @on-change="change" :step="15"></Slider>
         <Slider :value="40" :tip-format="format"></Slider>
         <Slider :value.sync="value" show-input show-stops range @on-change="change" :step="13"></Slider>
         <!--<Slider :max="10"></Slider>-->