uniapp+vue3的轮播图

图片：宽度：690 ,高度：340

<template>
	<view class="layout">
		<view class="banner">
			<swiper indicator-dots indicator-color="rgba(255,255,255,0.5)" indicator-active-color="#fff" autoplay circular>
				<swiper-item v-for="(item,index) in 3" :key="index" mode='aspectFill'>
					<image src="../../common/images/banner2.jpg"></image>
				</swiper-item>
			</swiper>
		</view>
	</view>
</template>

<script>
	
	
</script>

<style lang="scss" scoped>
	.layout{
		.banner{
			width: 750rpx;
			padding: 30rpx 0;
			swiper{
				width: 750rpx;
				height: 340rpx;
				&-item{
					width: 100%;
					height: 100%;
					padding: 0 30rpx;
					image{
						width: 100%;
						height:100%;
						border-radius: 12rpx;
					}
				}
				
			}
		}
	}

	
</style>

在公共样式加入

view,swiper,swiper-item{
	box-sizing: border-box;
	
}