other / mew-iview

Commit 77d460e8c4ef808fd612187ebf06957a249177cc

Authored by Rijn
1 parent 90f77e40

added offset function

Showing 2 changed files with 17 additions and 6 deletions   Show diff stats
Inline Side-by-side
src/components/carousel/carousel.vue
  Show/Hide comments   View file @77d460e
1 <template> 1 <template>
2 <div :class="classes"> 2 <div :class="classes">
3 - <div :class="[prefixCls + '-arrow', 'left']"> 3 + <div :class="[prefixCls + '-arrow', 'left']" @click="add(-1)">
4 <div class='placeholder'></div> 4 <div class='placeholder'></div>
5 <Icon type="arrow-left-b"></Icon> 5 <Icon type="arrow-left-b"></Icon>
6 </div> 6 </div>
@@ -10,7 +10,7 @@ @@ -10,7 +10,7 @@
10 <slot></slot> 10 <slot></slot>
11 </div> 11 </div>
12 </div> 12 </div>
13 - <div :class="[prefixCls + '-arrow', 'right']"> 13 + <div :class="[prefixCls + '-arrow', 'right']" @click="add(1)">
14 <div class='placeholder'></div> 14 <div class='placeholder'></div>
15 <Icon type="arrow-right-b"></Icon> 15 <Icon type="arrow-right-b"></Icon>
16 </div> 16 </div>
@@ -144,6 +144,12 @@ @@ -144,6 +144,12 @@
144 this.updatePos(); 144 this.updatePos();
145 }); 145 });
146 }, 146 },
  147 + add (offset) {
  148 + let index = this.currentIndex;
  149 + index += offset;
  150 + if (index === this.slides.length) index = 0;
  151 + this.currentIndex = index;
  152 + },
147 slide () { 153 slide () {
148 this.trackLeft = this.currentIndex * this.listWidth; 154 this.trackLeft = this.currentIndex * this.listWidth;
149 }, 155 },
@@ -151,10 +157,7 @@ @@ -151,10 +157,7 @@
151 window.clearInterval(this.timer); 157 window.clearInterval(this.timer);
152 if (this.autoplay) { 158 if (this.autoplay) {
153 this.timer = window.setInterval(() => { 159 this.timer = window.setInterval(() => {
154 - let index = this.currentIndex;  
155 - index ++;  
156 - if (index === this.slides.length) index = 0;  
157 - this.currentIndex = index; 160 + this.add(1);
158 }, this.autoplaySpeed); 161 }, this.autoplaySpeed);
159 } 162 }
160 } 163 }
test/routers/carousel.vue
  Show/Hide comments   View file @77d460e
@@ -11,6 +11,14 @@ @@ -11,6 +11,14 @@
11 <i-col span="4"> 11 <i-col span="4">
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">
  15 + Switch To
  16 + <Button-group>
  17 + <i-button @click="currentIndex = 0">0</i-button>
  18 + <i-button @click="currentIndex = 1">1</i-button>
  19 + <i-button @click="currentIndex = 2">2</i-button>
  20 + </Button-group>
  21 + </i-col>
14 </Row> 22 </Row>
15 <Carousel style="width: 50%; border: solid 1px #000" 23 <Carousel style="width: 50%; border: solid 1px #000"
16 :current-index.sync="currentIndex" 24 :current-index.sync="currentIndex"