小程序的swiper-item内容横排
发布于 5 年前 作者 ming55 4613 次浏览 来自 问答

想要实现类似gridview的效果,但是swiper-item里的view wcss失效,无法实现横排,是怎么回事?

预期如图:

实际如图:

代码如下:

<swiper indicator-dots="{{userIndicatorDots}}">

<swiper-item wx:for="{{userPage}}" wx:for-index=“i” wx:key="*this">

<view wx:for="{{userPageList[i]}}" class=‘userRow’ wx:key="*this">

<view class=‘userItem’>

<image src="{{item.image}}" class=“userAvatar” />

<text class=“userNameText”>{{item.name}}</text>

<text class=“userMoneyText”>已付{{item.money}}元</text>

</view>

</view>

</swiper-item>

.userRow{

flex-direction: row;

}

.userItem {

flex-direction: column;

background-color: #eee;

margin: 20rpx;

}

回到顶部