From 19cd2ed38e2ae72e48ae759b843a33808eee5e16 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Fri, 9 Aug 2019 11:54:42 +0800
Subject: [PATCH] [improvement] optimize watch options (#4075)

---
 src/area/index.js             |  4 +---
 src/count-down/demo/index.vue | 11 ++---------
 src/count-down/index.js       |  4 +---
 src/coupon-list/index.js      |  4 +---
 src/mixins/popup/index.js     |  4 +---
 src/mixins/portal.ts          |  4 +---
 src/picker/index.js           |  4 +---
 src/progress/index.js         | 13 ++++---------
 src/sku/Sku.js                |  4 +---
 src/tabbar/index.js           |  9 ++-------
 src/tabs/index.js             |  6 ++----
 src/toast/Toast.js            |  9 ++-------
 12 files changed, 19 insertions(+), 57 deletions(-)

diff --git a/src/area/index.js b/src/area/index.js
index 05423c6e4..7bf965c56 100644
--- a/src/area/index.js
+++ b/src/area/index.js
@@ -51,9 +51,7 @@ export default createComponent({
 
     areaList: {
       deep: true,
-      handler() {
-        this.setValues();
-      }
+      handler: 'setValues'
     },
 
     columnsNum() {
diff --git a/src/count-down/demo/index.vue b/src/count-down/demo/index.vue
index 860a45f1c..a1e6417fc 100644
--- a/src/count-down/demo/index.vue
+++ b/src/count-down/demo/index.vue
@@ -35,7 +35,7 @@
       <van-count-down
         ref="countDown"
         millisecond
-        :time="manualTime"
+        :time="3000"
         :auto-start="false"
         format="ss:SSS"
         @finish="$toast($t('finished'))"
@@ -73,7 +73,6 @@ export default {
       customFormat: '自定义格式',
       manualControl: '手动控制',
       formatWithDay: 'DD 天 HH 时 mm 分 ss 秒',
-      add: '延长',
       reset: '重置',
       pause: '暂停',
       start: '开始',
@@ -85,7 +84,6 @@ export default {
       customFormat: 'Custom Format',
       manualControl: 'Manual Control',
       formatWithDay: 'DD Day, HH:mm:ss',
-      add: 'Add',
       reset: 'Reset',
       pause: 'Pause',
       start: 'Start',
@@ -95,8 +93,7 @@ export default {
 
   data() {
     return {
-      time: 30 * 60 * 60 * 1000,
-      manualTime: 3000
+      time: 30 * 60 * 60 * 1000
     };
   },
 
@@ -111,10 +108,6 @@ export default {
 
     reset() {
       this.$refs.countDown.reset();
-    },
-
-    add() {
-      this.manualTime += 3000;
     }
   }
 };
diff --git a/src/count-down/index.js b/src/count-down/index.js
index d81229a92..f60912b1c 100644
--- a/src/count-down/index.js
+++ b/src/count-down/index.js
@@ -40,9 +40,7 @@ export default createComponent({
   watch: {
     time: {
       immediate: true,
-      handler() {
-        this.reset();
-      }
+      handler: 'reset'
     }
   },
 
diff --git a/src/coupon-list/index.js b/src/coupon-list/index.js
index fa1694432..7ca6cd2a1 100644
--- a/src/coupon-list/index.js
+++ b/src/coupon-list/index.js
@@ -94,9 +94,7 @@ export default createComponent({
       this.$emit('input', code);
     },
 
-    displayedCouponIndex(val) {
-      this.scrollToShowCoupon(val);
-    }
+    displayedCouponIndex: 'scrollToShowCoupon'
   },
 
   mounted() {
diff --git a/src/mixins/popup/index.js b/src/mixins/popup/index.js
index f6f88537b..afa9d0be3 100644
--- a/src/mixins/popup/index.js
+++ b/src/mixins/popup/index.js
@@ -62,9 +62,7 @@ export const PopupMixin = {
       this.$emit(type);
     },
 
-    overlay() {
-      this.renderOverlay();
-    }
+    overlay: 'renderOverlay'
   },
 
   mounted() {
diff --git a/src/mixins/portal.ts b/src/mixins/portal.ts
index 5c2c5aaab..80ac392cc 100644
--- a/src/mixins/portal.ts
+++ b/src/mixins/portal.ts
@@ -20,9 +20,7 @@ export function PortalMixin({ afterPortal }: PortalMixinOptions) {
     },
 
     watch: {
-      getContainer() {
-        this.portal();
-      }
+      getContainer: 'portal'
     },
 
     mounted() {
diff --git a/src/picker/index.js b/src/picker/index.js
index a77417c09..c7452cdc7 100644
--- a/src/picker/index.js
+++ b/src/picker/index.js
@@ -42,9 +42,7 @@ export default createComponent({
   },
 
   watch: {
-    columns() {
-      this.setColumns();
-    }
+    columns: 'setColumns'
   },
 
   methods: {
diff --git a/src/progress/index.js b/src/progress/index.js
index f773a0be1..1ad7e23e3 100644
--- a/src/progress/index.js
+++ b/src/progress/index.js
@@ -35,21 +35,16 @@ export default createComponent({
   },
 
   mounted() {
-    this.getWidth();
+    this.setWidth();
   },
 
   watch: {
-    showPivot() {
-      this.getWidth();
-    },
-
-    pivotText() {
-      this.getWidth();
-    }
+    showPivot: 'setWidth',
+    pivotText: 'setWidth'
   },
 
   methods: {
-    getWidth() {
+    setWidth() {
       this.$nextTick(() => {
         this.progressWidth = this.$el.offsetWidth;
         this.pivotWidth = this.$refs.pivot ? this.$refs.pivot.offsetWidth : 0;
diff --git a/src/sku/Sku.js b/src/sku/Sku.js
index f262b5fef..99ed73c98 100644
--- a/src/sku/Sku.js
+++ b/src/sku/Sku.js
@@ -105,9 +105,7 @@ export default createComponent({
       this.show = val;
     },
 
-    skuTree(val) {
-      this.resetSelectedSku(val);
-    }
+    skuTree: 'resetSelectedSku'
   },
 
   computed: {
diff --git a/src/tabbar/index.js b/src/tabbar/index.js
index 2cc8a8da2..c2c8d310a 100644
--- a/src/tabbar/index.js
+++ b/src/tabbar/index.js
@@ -30,13 +30,8 @@ export default createComponent({
   },
 
   watch: {
-    children() {
-      this.setActiveItem();
-    },
-
-    value() {
-      this.setActiveItem();
-    }
+    value: 'setActiveItem',
+    children: 'setActiveItem'
   },
 
   methods: {
diff --git a/src/tabs/index.js b/src/tabs/index.js
index 69403d739..d743db973 100644
--- a/src/tabs/index.js
+++ b/src/tabs/index.js
@@ -99,16 +99,14 @@ export default createComponent({
   },
 
   watch: {
+    color: 'setLine',
+
     active(name) {
       if (name !== this.currentName) {
         this.setCurrentIndexByName(name);
       }
     },
 
-    color() {
-      this.setLine();
-    },
-
     children() {
       this.setCurrentIndexByName(this.currentName || this.active);
       this.scrollIntoView();
diff --git a/src/toast/Toast.js b/src/toast/Toast.js
index a7d4c1105..cfd3b611d 100644
--- a/src/toast/Toast.js
+++ b/src/toast/Toast.js
@@ -44,13 +44,8 @@ export default createComponent({
   },
 
   watch: {
-    value() {
-      this.toggleClickable();
-    },
-
-    forbidClick() {
-      this.toggleClickable();
-    }
+    value: 'toggleClickable',
+    forbidClick: 'toggleClickable'
   },
 
   methods: {