added on-change event emitter
This commit is contained in:
parent
e9989f2b85
commit
c1af3facb0
2 changed files with 12 additions and 3 deletions
|
@ -186,7 +186,7 @@
|
|||
this.currentIndex = index;
|
||||
},
|
||||
dotsEvent (event, n) {
|
||||
if (event === this.trigger) {
|
||||
if (event === this.trigger && this.currentIndex !== n) {
|
||||
this.$emit('on-change', this.currentIndex, n);
|
||||
this.currentIndex = n;
|
||||
}
|
||||
|
@ -210,7 +210,8 @@
|
|||
autoplaySpeed () {
|
||||
this.setAutoplay();
|
||||
},
|
||||
currentIndex () {
|
||||
currentIndex (val, oldVal) {
|
||||
this.$emit('on-change', oldVal, val);
|
||||
this.$nextTick(() => {
|
||||
this.trackLeft = this.currentIndex * this.listWidth;
|
||||
});
|
||||
|
|
|
@ -54,6 +54,7 @@
|
|||
:dots="dots"
|
||||
:trigger="trigger"
|
||||
:arrow="arrow"
|
||||
@on-change="slideChange"
|
||||
easing="linear">
|
||||
<Carousel-item v-if="!remove">
|
||||
<Alert type="warning" show-icon>
|
||||
|
@ -71,6 +72,9 @@
|
|||
<Icon type="checkmark" style="font-size: 5em"></Icon>{{item}}
|
||||
</Carousel-item>
|
||||
</Carousel>
|
||||
<div>
|
||||
<p v-for="item in log">{{item}}</p>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
|
@ -83,12 +87,16 @@
|
|||
pushItem: [],
|
||||
arrow: 'hover',
|
||||
trigger: 'click',
|
||||
dots: 'inside'
|
||||
dots: 'inside',
|
||||
log: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
push () {
|
||||
this.pushItem.push('test');
|
||||
},
|
||||
slideChange (from, to) {
|
||||
this.log.push(`From ${from} To ${to}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Reference in a new issue