修改圆角样式不生效怎么办

 zhu

 主要实现这种圆角样式

<template>
<!-- 轮播图 -->
		<view class="swagger">
			<swiper class="swiperindex" indicator-color="rgba(255, 255, 255, 0.6)" :indicator-dots="true"
				:autoplay="true" circular="true" :interval="2000" :duration="500">
				<swiper-item v-for="(item,index) in imageList" :key="index">
					<view class="swiper-item">
						<image :src="item.src" mode=""></image>
					</view>
				</swiper-item>

			</swiper>
		</view>	
</template>


<style lang="scss">
        swiper-item {
					width: 100%;
					height: 100%;
					border-radius: 10px;

					.swiper-item {
						width: 100%;
						height: 100%;
						padding: 0;
						margin: 0;
						border-radius: 10px;

						image {
							width: 100%;
							border-radius: 10px;
						}
					}
				}

			}
</style>

注意只是设置一个只是在image设置圆角只有上部分会显示为圆角，下部分并不会，

所以要找到它的父级元素，都加上圆角边框，为了解决当新图片滑动出来的时候会出现先直角后变成圆角的状况