Fix:5038 【商城小程序】配置多个体验项目时,应整体轮播显示
This commit is contained in:
@@ -83,24 +83,37 @@
|
||||
</view>
|
||||
<view class="section">
|
||||
<view class="section-title">体验项目</view>
|
||||
<view class="experience-card" v-for="(item, index) in projectList" :key="index">
|
||||
<image
|
||||
v-if="item.projectImage"
|
||||
:src="item.projectImage"
|
||||
class="experience-image"
|
||||
mode="aspectFill"
|
||||
/>
|
||||
<view class="experience-info">
|
||||
<view class="experience-title-wrap">
|
||||
<view class="experience-title">
|
||||
{{ item.themeName || item.projectName }}
|
||||
<swiper
|
||||
v-if="projectList.length > 0"
|
||||
class="experience-swiper"
|
||||
circular
|
||||
:autoplay="true"
|
||||
:interval="3000"
|
||||
:indicator-dots="false"
|
||||
indicator-color="rgba(255, 255, 255, .4)"
|
||||
indicator-active-color="#ffffff"
|
||||
>
|
||||
<swiper-item v-for="(item, index) in projectList" :key="index">
|
||||
<view class="experience-card">
|
||||
<image
|
||||
v-if="item.projectImage"
|
||||
:src="item.projectImage"
|
||||
class="experience-image"
|
||||
mode="widthFix|heightFix"
|
||||
/>
|
||||
<view class="experience-info">
|
||||
<view class="experience-title-wrap">
|
||||
<view class="experience-title">
|
||||
{{ item.themeName || item.projectName }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="experience-subtitle">
|
||||
{{ item.projectIntro || item.detail }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="experience-subtitle">
|
||||
{{ item.projectIntro || item.detail }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
|
||||
<view class="section" v-if="project.detailText || project.remark">
|
||||
@@ -533,6 +546,11 @@ export default {
|
||||
box-shadow: 0 8rpx 24rpx rgba(197, 39, 51, 0.15);
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
.experience-swiper {
|
||||
margin-top: 16rpx;
|
||||
width: 100%;
|
||||
height: 520rpx;
|
||||
}
|
||||
.experience-image {
|
||||
width: 100%;
|
||||
height: 360rpx;
|
||||
|
||||
Reference in New Issue
Block a user