想要实现类似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;

}