1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253 |
- <template>
- <view class="ads">
- <swiper class="bg" circular :indicator-dots="false" :autoplay="true" :interval="5000" :duration="200">
- <swiper-item v-for="(item, index) in ads" :key="index">
- <view class="swiper">
- <image class="image" :src="item.image" @click.stop="goUrl(item.url)"></image>
- </view>
- </swiper-item>
- </swiper>
- </view>
- </template>
- <script>
- export default {
- props: {
- ads: {
- type: Array,
- default: []
- }
- },
- methods: {
- goUrl(url) {
- this.$navTo(url);
- }
- },
- }
- </script>
- <style lang="scss" scoped>
- .ads {
- width: 100%;
- height: 280rpx;
- padding: 0 10rpx;
- display: block;
- background: #fff;
- .bg {
- width: 100%;
- height: 240rpx;
- }
- }
- .bg,
- .swiper {
- width: 100%;
- height: 240rpx;
- margin-bottom: 550rpx;
- image {
- width: 100%;
- height: 100%;
- border-radius: 6rpx;
- }
- }
- </style>
|