remove autoplay direction prop

fix clear interval bug
This commit is contained in:
Rijn 2017-01-21 20:40:31 -06:00
parent 62808b2b03
commit 932db62320
2 changed files with 7 additions and 19 deletions

View file

@ -1,6 +1,6 @@
<template> <template>
<div :class="classes"> <div :class="classes">
<button :class="arrowClasses" class="left" @click="add(-1)"> <button :class="arrowClasses" class="left" @click="arrowEvent(-1)">
<Icon type="chevron-left"></Icon> <Icon type="chevron-left"></Icon>
</button> </button>
<div :class="[prefixCls + '-list']"> <div :class="[prefixCls + '-list']">
@ -8,7 +8,7 @@
<slot></slot> <slot></slot>
</div> </div>
</div> </div>
<button :class="arrowClasses" class="right" @click="add(1)"> <button :class="arrowClasses" class="right" @click="arrowEvent(1)">
<Icon type="chevron-right"></Icon> <Icon type="chevron-right"></Icon>
</button> </button>
<ul :class="dotsClasses"> <ul :class="dotsClasses">
@ -47,13 +47,6 @@
type: Number, type: Number,
default: 2000 default: 2000
}, },
autoplayDirection: {
type: String,
default: 'left',
validator (value) {
return oneOf(value, ['left', 'right']);
}
},
easing: { easing: {
type: String, type: String,
default: 'ease' default: 'ease'
@ -197,6 +190,10 @@
index = index % this.slides.length; index = index % this.slides.length;
this.currentIndex = index; this.currentIndex = index;
}, },
arrowEvent (offset) {
this.setAutoplay();
this.add(offset);
},
dotsEvent (event, n) { dotsEvent (event, n) {
if (event === this.trigger && this.currentIndex !== n) { if (event === this.trigger && this.currentIndex !== n) {
this.currentIndex = n; this.currentIndex = n;
@ -208,7 +205,7 @@
window.clearInterval(this.timer); window.clearInterval(this.timer);
if (this.autoplay) { if (this.autoplay) {
this.timer = window.setInterval(() => { this.timer = window.setInterval(() => {
this.add(this.autoplayDirection === 'left' ? 1 : -1); this.add(1);
}, this.autoplaySpeed); }, this.autoplaySpeed);
} }
}, },

View file

@ -11,13 +11,6 @@
<i-col span="4"> <i-col span="4">
Speed <Slider :value.sync="autoplaySpeed" :min="300" :max="5000"></Slider> Speed <Slider :value.sync="autoplaySpeed" :min="300" :max="5000"></Slider>
</i-col> </i-col>
<i-col span="4">
<p>Direction</p>
<Button-group>
<i-button @click="autoplayDirection = 'left'">Left</i-button>
<i-button @click="autoplayDirection = 'right'">Right</i-button>
</Button-group>
</i-col>
<i-col span="4"> <i-col span="4">
Switch To Switch To
<Button-group> <Button-group>
@ -66,7 +59,6 @@
:current-index.sync="currentIndex" :current-index.sync="currentIndex"
:autoplay="autoplay" :autoplay="autoplay"
:autoplay-speed="autoplaySpeed" :autoplay-speed="autoplaySpeed"
:autoplay-direction="autoplayDirection"
:dots="dots" :dots="dots"
:trigger="trigger" :trigger="trigger"
:arrow="arrow" :arrow="arrow"
@ -193,7 +185,6 @@
currentIndex: 0, currentIndex: 0,
autoplay: true, autoplay: true,
autoplaySpeed: 2000, autoplaySpeed: 2000,
autoplayDirection: 'left',
remove: false, remove: false,
pushItem: [], pushItem: [],
arrow: 'hover', arrow: 'hover',