Commit bade4e13bc81d28070e93823a233f3d136ce34cd
Committed by
GitHub
Merge pull request #228 from rijn/carousel
reset autoplay timer after trigger
Showing
1 changed file
with
10 additions
and
3 deletions
Show diff stats
src/components/carousel/carousel.vue
1 | <template> | 1 | <template> |
2 | <div :class="classes"> | 2 | <div :class="classes"> |
3 | - <button :class="arrowClasses" class="left" @click="add(-1)"> | 3 | + <button :class="arrowClasses" class="left" @click="arrowEvent(-1)"> |
4 | <Icon type="chevron-left"></Icon> | 4 | <Icon type="chevron-left"></Icon> |
5 | </button> | 5 | </button> |
6 | <div :class="[prefixCls + '-list']"> | 6 | <div :class="[prefixCls + '-list']"> |
@@ -8,7 +8,7 @@ | @@ -8,7 +8,7 @@ | ||
8 | <slot></slot> | 8 | <slot></slot> |
9 | </div> | 9 | </div> |
10 | </div> | 10 | </div> |
11 | - <button :class="arrowClasses" class="right" @click="add(1)"> | 11 | + <button :class="arrowClasses" class="right" @click="arrowEvent(1)"> |
12 | <Icon type="chevron-right"></Icon> | 12 | <Icon type="chevron-right"></Icon> |
13 | </button> | 13 | </button> |
14 | <ul :class="dotsClasses"> | 14 | <ul :class="dotsClasses"> |
@@ -175,11 +175,13 @@ | @@ -175,11 +175,13 @@ | ||
175 | 175 | ||
176 | this.updateSlides(true, true); | 176 | this.updateSlides(true, true); |
177 | this.updatePos(); | 177 | this.updatePos(); |
178 | + this.updateOffset(); | ||
178 | }); | 179 | }); |
179 | }, | 180 | }, |
180 | handleResize () { | 181 | handleResize () { |
181 | this.listWidth = parseInt(getStyle(this.$el, 'width')); | 182 | this.listWidth = parseInt(getStyle(this.$el, 'width')); |
182 | this.updatePos(); | 183 | this.updatePos(); |
184 | + this.updateOffset(); | ||
183 | }, | 185 | }, |
184 | add (offset) { | 186 | add (offset) { |
185 | let index = this.currentIndex; | 187 | let index = this.currentIndex; |
@@ -188,9 +190,15 @@ | @@ -188,9 +190,15 @@ | ||
188 | index = index % this.slides.length; | 190 | index = index % this.slides.length; |
189 | this.currentIndex = index; | 191 | this.currentIndex = index; |
190 | }, | 192 | }, |
193 | + arrowEvent (offset) { | ||
194 | + this.setAutoplay(); | ||
195 | + this.add(offset); | ||
196 | + }, | ||
191 | dotsEvent (event, n) { | 197 | dotsEvent (event, n) { |
192 | if (event === this.trigger && this.currentIndex !== n) { | 198 | if (event === this.trigger && this.currentIndex !== n) { |
193 | this.currentIndex = n; | 199 | this.currentIndex = n; |
200 | + // Reset autoplay timer when trigger be activated | ||
201 | + this.setAutoplay(); | ||
194 | } | 202 | } |
195 | }, | 203 | }, |
196 | setAutoplay () { | 204 | setAutoplay () { |
@@ -203,7 +211,6 @@ | @@ -203,7 +211,6 @@ | ||
203 | }, | 211 | }, |
204 | updateOffset () { | 212 | updateOffset () { |
205 | this.$nextTick(() => { | 213 | this.$nextTick(() => { |
206 | - this.handleResize(); | ||
207 | this.trackOffset = this.currentIndex * this.listWidth; | 214 | this.trackOffset = this.currentIndex * this.listWidth; |
208 | }); | 215 | }); |
209 | } | 216 | } |