ceramic/src/components/Carousel.vue

47 lines
854 B
Vue

<template>
<el-row>
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
<div class="slideshow">
<el-carousel trigger="click" height="36.2vw">
<el-carousel-item v-for="(item,index) in bannerDate" :key="index">
<div>
<img :src="item.imgurl" alt="">
</div>
</el-carousel-item>
</el-carousel>
</div>
</el-col>
</el-row>
</template>
<script>
export default {
name: "Carousel",
data() {
return {
bannerDate: [
{
imgurl: require('@/assets/banner/banner1.jpg')
}, {
imgurl: require('@/assets/banner/banner2.jpg')
},
{
imgurl: require('@/assets/banner/banner3.jpg')
}
]
}
}
}
</script>
<style scoped>
.slideshow {
width: 100%;
}
img {
width: 100%;
}
</style>