如图:
1608713937(1).png
思路(vue):
1、整体是个循环,循环里面有图片和文字两个模块;
2、图片又是一个循环,图片的个数不同
<div v-for="(item,indexs) in List" :key="indexs" style="display:flex;">
//左边的图片
<div v-for="(i,index) in item.num" :key="index">
<img src="../assets/img/help/help.png" alt="" >
</div>
//右边的文字
{{item.title}}
</div>
data() {
return {
List: [
{
num:3,
title: "人数"
},
{
num:2,
title: "人数"
}
]
};
},
其他需要的样式自己看清加哦~
如果还有其他简便写法,欢迎各位一起讨论哦~