forked from opentiny/tiny-vue
37 lines
847 B
Vue
37 lines
847 B
Vue
<template>
|
|
<div>
|
|
<tiny-carousel type="card" height="150px">
|
|
<tiny-carousel-item :class="bgColor[item - 1]" v-for="item in 4" :key="item">
|
|
<h3>{{ item }}</h3>
|
|
</tiny-carousel-item>
|
|
</tiny-carousel>
|
|
<br />
|
|
<tiny-carousel type="card" height="200px">
|
|
<tiny-carousel-item :class="bgColor[item - 1]" v-for="item in 4" :key="item">
|
|
<h3>{{ item }}</h3>
|
|
</tiny-carousel-item>
|
|
</tiny-carousel>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { Carousel, CarouselItem } from '@opentiny/vue'
|
|
|
|
export default {
|
|
components: {
|
|
TinyCarousel: Carousel,
|
|
TinyCarouselItem: CarouselItem
|
|
},
|
|
data() {
|
|
return {
|
|
bgColor: [
|
|
'bg-color-info-primary-subtle',
|
|
'bg-color-success-subtle',
|
|
'bg-color-icon-primary',
|
|
'bg-color-warning-subtle'
|
|
]
|
|
}
|
|
}
|
|
}
|
|
</script>
|