update props and events
This commit is contained in:
parent
6c9acb08fa
commit
41f83010fa
4 changed files with 61 additions and 5 deletions
|
@ -1,11 +1,55 @@
|
|||
<template>
|
||||
<div :class="prefixCls">
|
||||
<div :class="classes">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
const prefixCls = 'ivu-cascader';
|
||||
import Icon from '../icon/icon.vue';
|
||||
|
||||
const prefixCls = 'ivu-carousel';
|
||||
|
||||
export default {
|
||||
name: 'Carousel'
|
||||
name: 'Carousel',
|
||||
props: {
|
||||
arrows: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
autoplay: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
autoplaySpeed: {
|
||||
type: Number,
|
||||
default: 2000
|
||||
},
|
||||
easing: {
|
||||
type: String,
|
||||
default: 'ease'
|
||||
},
|
||||
dots: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
fade: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
vertical: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
// events: before-change(from, to), after-change(current, from)
|
||||
computed: {
|
||||
classes () {
|
||||
return [
|
||||
`${prefixCls}`,
|
||||
{
|
||||
[`${prefixCls}-vertical`]: this.vertical
|
||||
}
|
||||
];
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -2,5 +2,10 @@
|
|||
@carousel-item-prefix-cls: ~"@{css-prefix}carousel-item";
|
||||
|
||||
.@{carousel-prefix-cls} {
|
||||
|
||||
position: relative;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
user-select: none;
|
||||
touch-action: pan-y;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
|
|
@ -34,4 +34,5 @@
|
|||
@import "menu";
|
||||
@import "date-picker";
|
||||
@import "time-picker";
|
||||
@import "form";
|
||||
@import "form";
|
||||
@import "carousel";
|
|
@ -1,5 +1,11 @@
|
|||
<template>
|
||||
<Carousel>
|
||||
<Carousel-item>test1</Carousel-item>
|
||||
<Carousel-item>test2</Carousel-item>
|
||||
<Carousel-item>test3</Carousel-item>
|
||||
</Carousel>
|
||||
|
||||
<Carousel :vertical="true">
|
||||
<Carousel-item></Carousel-item>
|
||||
</Carousel>
|
||||
</template>
|
||||
|
|
Loading…
Add table
Reference in a new issue