swiper使用:在ios14.4中可以正常显示;在ios14.6中swiper内容无法显示
代码
<!-- 顶部选项卡 -->
<view class="nav-bar">
<view
v-for="(item, index) in navList"
:key="index"
:class="index == tabCurrentIndex ? 'nav-item current' : 'nav-item'"
:id="'tab' + index"
@click="tabClick(index)"
>
{{ item.text }}
</view>
</view>
<!-- 内容部分 -->
<swiper :duration="300" :current="tabCurrentIndex" class="swiper-box" @change="changeTab">
<swiper-item style="overflow: scroll;" v-for="(tabItem, tabIndex) in navList" :key="tabIndex">
<scroll-view class="list-scroll-content" scroll-y @scrolltolower="getEvents">
<!-- 空白页 -->
<view class="tab-content">
<view class="type-item" v-for="(item, i) in tabItem.actionList" :key="i" @click="checkTrans(item, tabIndex)">
<view class="itemtitle">{{ item.represent }}</view>
<view class="" v-if="item.coverImg" style="width: 500upx;height: 300upx;position: relative;background-color: #ECECEC;">
<image :src="baseImg + item.coverImg" style="width: 500upx;height: 300upx;margin-bottom: 20upx;" mode="aspectFit"></image>
<image src="../../static/play.png" style="width: 50upx;height: 50upx;position: absolute;left: 225upx;top: 125upx;"></image>
</view>
<view class="imgListView" v-else>
<view v-for="(itemImg, index) in item.imgList" :key="'img' + index">
<image class="imgview" :src="baseImg+itemImg" mode="aspectFill"></image>
</view>
</view>
<view class="bottomItem">
<text>{{item.createDate}}</text>
<image class="plimg" src="../../static/img/pinglun.png" style="width: 20upx;height: 20upx;"></image>
<text>评论</text>
<view class="zanview" v-if="tabCurrentIndex==1" @tap.stop="addStar(item,i)">
<image class="zanimg" :src="item.starFlag=='1'?'../../static/img/zan.png':'../../static/img/unzan.png'" style="width: 20upx;height: 20upx;"></image>
<text>赞一下</text>
</view>
<view class="tousuview" @tap.stop="tousuClick(item,i)">
举报屏蔽
</view>
</view>
</view>
</view>
<!-- 没有文件 -->
<view class="no-list" v-if="tabItem.noList">
<image src="/static/empty.png" mode=""></image>
<view style="color: #CCCCCC;font-size: 24upx;">暂无数据</view>
</view>
<uni-load-more :status="tabItem.loadingType" v-else></uni-load-more>
</scroll-view>
</swiper-item>
</swiper>
scss样式
/* 顶部tabbar */
.nav-bar {
display: flex;
height: 80upx;
position: relative;
align-items: center;
z-index: 10;
width: 100%;
background-color: #FFFFFF;
.nav-item {
flex: 1;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: 30upx;
color: #666;
position: relative;
&:after {
content: '';
width: 0;
height: 0;
border-bottom: 4upx solid #09BF82;
position: absolute;
left: 50%;
bottom: 0;
transform: translateX(-50%);
transition: 0.3s;
}
}
.current {
color: #09BF82;
&:after {
width: 30%;
}
}
}
.list-scroll-content {
height: 100%;
}
.swiper-box {
height: calc(100% - 80upx);
width: 100%;
.tab-content {
display: flex;
flex-direction: column;
padding: 0 30upx;
.type-item {
display: flex;
flex-direction: column;
padding: 20upx 0upx;
border-bottom: 1upx solid #dddddd;
color: #666;
font-size: 30upx;
margin-bottom: 20upx;
.imgListView{
display: flex;
flex-wrap: wrap;
.imgview{
margin-right: 20upx;
margin-top: 10upx;
width: 180upx;
height: 180upx;
}
}
.bottomItem{
display: flex;
align-items: center;
justify-content: flex-start;
color: #999;
font-size: 22upx;
.plimg{
margin-left: 30upx;
margin-right: 10upx;
}
.zanview{
color: #999;
font-size: 22upx;
.zanimg{
margin-left: 30upx;
margin-right: 10upx;
}
}
.tousuview{
margin-left: 40upx;
color: #999;
font-size: 22upx;
}
}
}
}
}
.no-list {
text-align: center;
padding-top: 280upx;
image {
width: 361upx;
height: 309upx;
}
}