<view class="swiper_cent">
   <swiper class='u-wrp-bnr' 
	:indicator-dots='false' 
	autoplay='true' 
	interval='3000' 
	duration='1000' circular='true'
	@change="swiperChange">
	     <block v-for="(item,i) in swiper" :key="i" >
	       <swiper-item>
	         <image :src='item.src' class='u-img-slide' mode='aspectFill'></image>
	       </swiper-item>
	     </block>
	   </swiper>
	<view class="swiper_zhishi">
		<view :class="swiperKey == i?'view_active':''" v-for="(item,i) in bnrUrl" :key="i"></view>
	</view>
</view>

export default {
	data() {
		return {
			swiper:[			//轮播数据
				{src:'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=1529354343,4008095697&fm=26&gp=0.jpg'},
				{src:'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1663879126,2733636093&fm=26&gp=0.jpg'},
			],
			swiperKey:0,		//轮播位置
		}
	},
	onLoad() {
	
	},
	methods: {
		swiperChange(e){
			// console.log(e.detail);
			this.swiperKey = e.detail.current
		}
	}
}

.swiper_cent{
	display: flex;
	justify-content: center;
	border-radius:7rpx;
	position: relative;
	overflow: hidden;
}
.swiper_zhishi{
	display: flex;
	align-items: center;
	width: 100%;
	justify-content: center;
	position: absolute;
	bottom: 15rpx;
	view{
		width: 29rpx;
		height: 4rpx;
		background: #FFFFFF;
		border-radius: 2rpx;
		margin-right: 13rpx;
		color: #000;
	}
	.view_active{
		background: #3192FE;
	}
}

.u-wrp-bnr {
	width: 700rpx;
	height: 278rpx;
	display: block;
	background: #f0f0f0;
	border-radius:7rpx;
}
.u-img-slide {
	width: 100%;
	height: inherit;
}