Uniapp的Swiper无法显示内容
不显示的原因是要给swiper 一个宽度uniapp 文档中并没有给出所以不显示。
·
<template>
<view class="content">
<swiper class="swiper" :indicator-dots="true" :autoplay="true" :interval="2000"
:duration="500">
<swiper-item>
<view class="swiper-item ">A</view>
</swiper-item>
<swiper-item>
<view class="swiper-item">B</view>
</swiper-item>
<swiper-item>
<view class="swiper-item">C</view>
</swiper-item>
</swiper>
1234
</view>
</template>
<script>
export default {
data() {
return {
background: ['color1', 'color2', 'color3'],
indicatorDots: true,
autoplay: true,
interval: 2000,
duration: 500
}
},
onLoad() {
},
methods: {
}
}
</script>
<style lang="less">
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.swiper {
height: 300rpx;
width: 100%;
.swiper-item {
display: block;
height: 300rpx;
line-height: 300rpx;
text-align: center;
border:1rpx solid #EC3232;
}
}
.uni-bg-red{
background: #EC3232;
}
</style>
不显示的原因是 要给swiper 一个 宽度 uniapp 文档中 并没有给出 所以不显示
效果图
更多推荐
已为社区贡献1条内容
所有评论(0)