阻止transition事件冒泡、调整样式

bajian · bajian · commit 9c4f8ad1fcf6 · 2016-10-02T13:38:03.000+08:00
diff --git a/dist/index.html b/dist/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1,user-scalable=0,minimum-scale=1,maximum-scale=1"><title>slider</title><link href=/static/css/app.9e7f972b49d57a4d672c976bb4665bf5.css rel=stylesheet></head><body><app></app><script type=text/javascript src=/static/js/manifest.09623dc929af452d11b5.js></script><script type=text/javascript src=/static/js/vendor.472387e64dd46b801244.js></script><script type=text/javascript src=/static/js/app.330d79f06e47ad5a2afc.js></script></body></html>
+<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1,user-scalable=0,minimum-scale=1,maximum-scale=1"><title>slider</title><link href=static/css/app.9e7f972b49d57a4d672c976bb4665bf5.css rel=stylesheet></head><body><app></app><script type=text/javascript src=static/js/manifest.09623dc929af452d11b5.js></script><script type=text/javascript src=static/js/vendor.472387e64dd46b801244.js></script><script type=text/javascript src=static/js/app.330d79f06e47ad5a2afc.js></script></body></html>
diff --git a/src/components/vue-slider.vue b/src/components/vue-slider.vue
@@ -218,13 +218,15 @@
                     this.$emit('slide-revert-start', this.currentPage);
                 }
             },
-            _onTransitionEnd() {
+            _onTransitionEnd(e) {
                 this.transitioning = false;
                 if (this._isPageChanged()) {
                     this.$emit('slide-change-end', this.currentPage);
                 } else {
                     this.$emit('slide-revert-end', this.currentPage);
                 }
+                e.stopPropagation()
+
             },
             _isPageChanged() {
                 return this.lastPage !== this.currentPage;
@@ -274,7 +276,6 @@
       border-radius: 50%;
       background-color: #000000;
       opacity: .2;
-      transition: all .5s ease;
       cursor:pointer
     }
 
@@ -291,7 +292,7 @@
 
     .swiper-pagination-bullet {
       display: block;
-      margin: 6px 0;
+      margin: 3px 0;
     }
   }
 

Original file line number	Diff line number	Diff line change
`@@ -1 +1 @@`
`1`		-<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1,user-scalable=0,minimum-scale=1,maximum-scale=1"><title>slider</title><link href=/static/css/app.9e7f972b49d57a4d672c976bb4665bf5.css rel=stylesheet></head><body><app></app><script type=text/javascript src=/static/js/manifest.09623dc929af452d11b5.js></script><script type=text/javascript src=/static/js/vendor.472387e64dd46b801244.js></script><script type=text/javascript src=/static/js/app.330d79f06e47ad5a2afc.js></script></body></html>
	`1`	+<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1,user-scalable=0,minimum-scale=1,maximum-scale=1"><title>slider</title><link href=static/css/app.9e7f972b49d57a4d672c976bb4665bf5.css rel=stylesheet></head><body><app></app><script type=text/javascript src=static/js/manifest.09623dc929af452d11b5.js></script><script type=text/javascript src=static/js/vendor.472387e64dd46b801244.js></script><script type=text/javascript src=static/js/app.330d79f06e47ad5a2afc.js></script></body></html>
Original file line number	Diff line number	Diff line change
`@@ -218,13 +218,15 @@`
`218`	`218`	`this.$emit('slide-revert-start', this.currentPage);`
`219`	`219`	`}`
`220`	`220`	`},`
`221`		`- _onTransitionEnd() {`
	`221`	`+ _onTransitionEnd(e) {`
`222`	`222`	`this.transitioning = false;`
`223`	`223`	`if (this._isPageChanged()) {`
`224`	`224`	`this.$emit('slide-change-end', this.currentPage);`
`225`	`225`	`} else {`
`226`	`226`	`this.$emit('slide-revert-end', this.currentPage);`
`227`	`227`	`}`
	`228`	`+ e.stopPropagation()`
	`229`	`+`
`228`	`230`	`},`
`229`	`231`	`_isPageChanged() {`
`230`	`232`	`return this.lastPage !== this.currentPage;`
`@@ -274,7 +276,6 @@`
`274`	`276`	`border-radius: 50%;`
`275`	`277`	`background-color: #000000;`
`276`	`278`	`opacity: .2;`
`277`		`- transition: all .5s ease;`
`278`	`279`	`cursor:pointer`
`279`	`280`	`}`
`280`	`281`
`@@ -291,7 +292,7 @@`
`291`	`292`
`292`	`293`	`.swiper-pagination-bullet {`
`293`	`294`	`display: block;`
`294`		`- margin: 6px 0;`
	`295`	`+ margin: 3px 0;`
`295`	`296`	`}`
`296`	`297`	`}`
`297`	`298`