35 lines
734 B
Vue
35 lines
734 B
Vue
<template>
|
|
<swiper class="banner-swiper" :indicator-dots="true" :autoplay="true" :interval="3000" circular>
|
|
<!-- 视频项 -->
|
|
<swiper-item v-if="video">
|
|
<video class="banner-swiper__video" :src="video" controls />
|
|
</swiper-item>
|
|
<!-- 图片项 -->
|
|
<swiper-item v-for="(img, idx) in images" :key="idx">
|
|
<image class="banner-swiper__image" :src="img" mode="aspectFill" />
|
|
</swiper-item>
|
|
</swiper>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
defineProps<{
|
|
images: string[]
|
|
video?: string
|
|
}>()
|
|
</script>
|
|
|
|
<style scoped>
|
|
.banner-swiper {
|
|
width: 100%;
|
|
height: 600rpx;
|
|
}
|
|
.banner-swiper__image {
|
|
width: 100%;
|
|
height: 600rpx;
|
|
}
|
|
.banner-swiper__video {
|
|
width: 100%;
|
|
height: 600rpx;
|
|
}
|
|
</style>
|