flex 布局 每行5个,一共两行

99 阅读1分钟

image.png

`

<view class="wrapper">
     <view v-for="(item,index) in 10" :key="index" class="c-item flex flex-column align-center">
		<u-image src="" width="100rpx" height="100rpx"></u-image>
		<text>{{index+1}}方案</text>
      </view>
</view>
            
            
   .wrapper {
		flex-wrap: wrap;
		margin: 0 -24rpx; //不需要可以注释
		.c-item {
			margin-bottom: 20rpx;
			flex: 0 0 20%;
		}
	}
            
                 
            

用grid布局更简单,稍后更新