Commit 932db62320c5fb4e692ec425cea781706999d31d
1 parent
62808b2b
remove autoplay direction prop
fix clear interval bug
Showing
2 changed files
with
7 additions
and
19 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"> |
@@ -47,13 +47,6 @@ | @@ -47,13 +47,6 @@ | ||
47 | type: Number, | 47 | type: Number, |
48 | default: 2000 | 48 | default: 2000 |
49 | }, | 49 | }, |
50 | - autoplayDirection: { | ||
51 | - type: String, | ||
52 | - default: 'left', | ||
53 | - validator (value) { | ||
54 | - return oneOf(value, ['left', 'right']); | ||
55 | - } | ||
56 | - }, | ||
57 | easing: { | 50 | easing: { |
58 | type: String, | 51 | type: String, |
59 | default: 'ease' | 52 | default: 'ease' |
@@ -197,6 +190,10 @@ | @@ -197,6 +190,10 @@ | ||
197 | index = index % this.slides.length; | 190 | index = index % this.slides.length; |
198 | this.currentIndex = index; | 191 | this.currentIndex = index; |
199 | }, | 192 | }, |
193 | + arrowEvent (offset) { | ||
194 | + this.setAutoplay(); | ||
195 | + this.add(offset); | ||
196 | + }, | ||
200 | dotsEvent (event, n) { | 197 | dotsEvent (event, n) { |
201 | if (event === this.trigger && this.currentIndex !== n) { | 198 | if (event === this.trigger && this.currentIndex !== n) { |
202 | this.currentIndex = n; | 199 | this.currentIndex = n; |
@@ -208,7 +205,7 @@ | @@ -208,7 +205,7 @@ | ||
208 | window.clearInterval(this.timer); | 205 | window.clearInterval(this.timer); |
209 | if (this.autoplay) { | 206 | if (this.autoplay) { |
210 | this.timer = window.setInterval(() => { | 207 | this.timer = window.setInterval(() => { |
211 | - this.add(this.autoplayDirection === 'left' ? 1 : -1); | 208 | + this.add(1); |
212 | }, this.autoplaySpeed); | 209 | }, this.autoplaySpeed); |
213 | } | 210 | } |
214 | }, | 211 | }, |
test/routers/carousel.vue
@@ -12,13 +12,6 @@ | @@ -12,13 +12,6 @@ | ||
12 | Speed <Slider :value.sync="autoplaySpeed" :min="300" :max="5000"></Slider> | 12 | Speed <Slider :value.sync="autoplaySpeed" :min="300" :max="5000"></Slider> |
13 | </i-col> | 13 | </i-col> |
14 | <i-col span="4"> | 14 | <i-col span="4"> |
15 | - <p>Direction</p> | ||
16 | - <Button-group> | ||
17 | - <i-button @click="autoplayDirection = 'left'">Left</i-button> | ||
18 | - <i-button @click="autoplayDirection = 'right'">Right</i-button> | ||
19 | - </Button-group> | ||
20 | - </i-col> | ||
21 | - <i-col span="4"> | ||
22 | Switch To | 15 | Switch To |
23 | <Button-group> | 16 | <Button-group> |
24 | <i-button @click="currentIndex = 0">0</i-button> | 17 | <i-button @click="currentIndex = 0">0</i-button> |
@@ -66,7 +59,6 @@ | @@ -66,7 +59,6 @@ | ||
66 | :current-index.sync="currentIndex" | 59 | :current-index.sync="currentIndex" |
67 | :autoplay="autoplay" | 60 | :autoplay="autoplay" |
68 | :autoplay-speed="autoplaySpeed" | 61 | :autoplay-speed="autoplaySpeed" |
69 | - :autoplay-direction="autoplayDirection" | ||
70 | :dots="dots" | 62 | :dots="dots" |
71 | :trigger="trigger" | 63 | :trigger="trigger" |
72 | :arrow="arrow" | 64 | :arrow="arrow" |
@@ -193,7 +185,6 @@ | @@ -193,7 +185,6 @@ | ||
193 | currentIndex: 0, | 185 | currentIndex: 0, |
194 | autoplay: true, | 186 | autoplay: true, |
195 | autoplaySpeed: 2000, | 187 | autoplaySpeed: 2000, |
196 | - autoplayDirection: 'left', | ||
197 | remove: false, | 188 | remove: false, |
198 | pushItem: [], | 189 | pushItem: [], |
199 | arrow: 'hover', | 190 | arrow: 'hover', |