[improvement] Swipe: optimize swipe event binding (#3652)

packages/swipe/index.js

@@ -1,11 +1,23 @@
 import { use } from '../utils';
-import { on, off, preventDefault } from '../utils/dom/event';
+import { preventDefault } from '../utils/dom/event';
 import { TouchMixin } from '../mixins/touch';
+import { BindEventMixin } from '../mixins/bind-event';
 
 const [sfc, bem] = use('swipe');
 
 export default sfc({
-  mixins: [TouchMixin],
+  mixins: [
+    TouchMixin,
+    BindEventMixin(function (bind, isBind) {
+      bind(window, 'resize', this.onResize, true);
+
+      if (isBind) {
+        this.initialize();
+      } else {
+        this.clear();
+      }
+    })
+  ],
 
   props: {
     width: Number,
@@ -45,30 +57,6 @@ export default sfc({
     };
   },
 
-  mounted() {
-    this.initialize();
-
-    if (!this.$isServer) {
-      on(window, 'resize', this.onResize, true);
-    }
-  },
-
-  activated() {
-    if (this.rendered) {
-      this.initialize();
-    }
-
-    this.rendered = true;
-  },
-
-  destroyed() {
-    this.clear();
-
-    if (!this.$isServer) {
-      off(window, 'resize', this.onResize, true);
-    }
-  },
-
   watch: {
     swipes() {
       this.initialize();
@@ -265,15 +253,18 @@ export default sfc({
           }, 30);
         }, autoplay);
       }
-    }
     },
 
-  render(h) {
+    renderIndicator() {
       const { count, activeIndicator } = this;
+      const slot = this.slots('indicator');
 
-    const Indicator =
+      if (slot) {
-      this.slots('indicator') ||
+        return slot;
-      (this.showIndicators && count > 1 && (
+      }
+
+      if (this.showIndicators && count > 1) {
+        return (
           <div class={bem('indicators', { vertical: this.vertical })}>
             {Array(...Array(count)).map((empty, index) => (
               <i
@@ -282,8 +273,12 @@ export default sfc({
               />
             ))}
           </div>
-      ));
+        );
+      }
+    }
+  },
 
+  render(h) {
     return (
       <div class={bem()}>
         <div
@@ -297,7 +292,7 @@ export default sfc({
         >
           {this.slots()}
         </div>
-        {Indicator}
+        {this.renderIndicator()}
       </div>
     );
   }