<swiper-item v-for="item in 4" :key="item">
<view class="swiper-item uni-bg-red">A ---{{ item }}</view>
</swiper-item>
</swiper>
</view>
<!-- </view> -->
</template>
<script>
export default {
name: "swiper",
data() {
return {
};
},
props: {
indicatorDots: {
type: Boolean,
default: true
},
autoplay: {
type: Boolean,
default: true
},
interval: {
type: Number,
default: 2000
},
duration: {
type: Number,
default: 500
}
},
methods: {
}, };
</script>
<style lang="scss" scoped>
.swiper-con {
.swiper {
height: 300rpx;
}
.swiper-item {
display: block;
height: 300rpx;
line-height: 300rpx;
text-align: center;
}
.swiper-list {
margin-top: 40rpx;
margin-bottom: 0;
}
.uni-swiper-dot {
width: 10rpx;
height: 4rpx;
}
.uni-swiper-dot-active {
width: 40rpx;
border-radius: 6rpx;
}
}
</style>
