true
Vue v-for list数据循环 每3或者（n）个一组
true
template 代码：
1
2
3
4
5
6
7
8
9
10
11
12
13
| <el-carousel-item v-for="(item,index) in listTemp" :key="index">
<div style="margin-left: 17%;margin-right: 10%;margin-top: 20px;">
<div v-for="o in item" :key="o" style="display:inline;padding: 0.6rem">
<el-card :body-style="{ padding: '0px' }" style="width: 20%;max-height: 200px" @click.native="showDrawer(o)">
<img :src="o.imgPath" class="image">
<div style="padding: 10px;font-size:14px;display: flex;justify-content: space-between">
<span>{{ o.eventdate }}</span>
<span>{{ o.position }}</span>
</div>
</el-card>
</div>
</div>
</el-carousel-item>
|
computed 代码：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| computed: {
listTemp() {
let index = 0
const count = 4
const arrTemp = []
const experts = this.alarmImgList
for (let i = 0; i < this.alarmImgList.length; i++) {
index = parseInt(i / count)
if (arrTemp.length <= index) {
arrTemp.push([])
}
arrTemp[index].push(experts[i])
}
return arrTemp
}
}
|
