uniapp applet flex layout v-for 4 columns show

Note: The picture comes from the resources of the project backend interface, so using the v-for.

Keywords: uniapp applet flex v-for 4 column layout showing an adaptive

 

 

 

<view style="display: flex; flex-direction: row;flex-wrap: wrap;margin: 0 5%;">
　　<view style="width: 25%;margin-bottom: 16upx;" v-for='(items,indexs) in item.tags' :key='indexs'>
　　　　<view>
　　　　　　<image :src="items.imageUrl" style="width: 40px;height: 40px;margin: 0 25%;" ></image>
　　　　　　<view style="text-align: center;font-size: 10px;font-family: Arial;">
　　　　　　　　{{items.name}}
　　　　　　</view>
　　　　</view>
　　</view>
</view>