<template>
	<view class="carousel">
		<swiper indicator-dots :circular="true" duration="400">
			<swiper-item class="swiper-item" v-for="(item, index) in imgList" :key="index">
				<view class="image-wrapper"><image :src="item" class="loaded" mode="scaleToFill"></image></view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
export default {
	props: {
		imgList: {
			type: Array,
			default: function () {
				return []
			}
		},
	},
	data() {
		return {
			
		};
	},
};
</script>

<style lang="scss">
.carousel {
	/* #ifdef APP-PLUS */
	padding-top: var(--status-bar-height);
	/* #endif */
	height: 700rpx;
	position: relative;
	swiper {
		height: 100%;
	}
	.image-wrapper {
		width: 100%;
		height: 100%;
	}
	.swiper-item {
		display: flex;
		justify-content: center;
		align-content: center;
		height: 700rpx;
		overflow: hidden;
		image {
			width: 100%;
			height: 100%;
		}
	}
}
</style>
