<template>
<view class="">
<swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration"
:indicator-active-color="active_color" :circular="circular">
<swiper-item v-for="(item,index) in imgs" :key="index">
<image :src="item.url" mode="" style="width:200px;height:200px;"></image>
</swiper-item>
</swiper>
</view>
</template>
<script>
export default {
name: "",
data() {
return {
active_color: "#AE81FF", //当前选中的指示点颜色
indicatorDots: true, //是否显示面板指示点
autoplay: true, //是否自动切换
interval: 2000, //自动切换时间间隔
duration: 500, //滑动动画时长
circular: true, //是否采用衔接滑动,即播放到末尾后重新回到开头
imgs: [{
url: require("../../static/logo.png"),
},
{
url: require("../../static/logo.png"),
},
{
url: require("../../static/logo.png"),
},
{
url: require("../../static/logo.png"),
},
]
}
},
methods: {
},
}
</script>
<style>
</style>
uniapp轮播图
猜你喜欢
转载自blog.csdn.net/weixin_49295874/article/details/113181804
今日推荐
周排行