//html
<view v-for="(item, boxIndex) in pageData" :key="boxIndex">
<view v-for="(child, cIndex) in item.data" :key="boxIndex" :class="type==1?'box_n':'box_s'"
v-if="showItem[level] && showItem[level][boxIndex]">
<text>{{child.name}}</text>
</view>
</view>
//js
//data
pageData:[
{
level:1,
data:[
{
id:0,
name:'测试0'
},
{
id:1,
name:'测试1'
},
{
id:2,
name:'测试2'
},
{
id:3,
name:'测试3'
}
]
},
{
level:2,
data:[
{
id:0,
name:'测试0'
},
{
id:1,
name:'测试1'
},{
id:2,
name:'测试2'
},
{
id:3,
name:'测试3'
}
]
},
],
showItem:[
[false,false,false,false],
[false,false,false,false]
]
//function
initLoadDataWithDelay() {
let rowIndex = 0;
let itemIndex = 0;
let interval = setInterval(() => {
if (rowIndex < this.pageData.length) {
this.$set(this.showItem[rowIndex], itemIndex, true);
itemIndex++;
if (itemIndex >= this.pageData[rowIndex].data.length) {
itemIndex = 0;
rowIndex++;
}
} else {
clearInterval(interval);
}
}, 230);
},
双重for循环数据按顺序一个一个的显示(记录)
最新推荐文章于 2024-11-07 09:14:33 发布