记录一个小问题,
拿到的返回数据
performance_list = [
{
id:'1001',
title:'测试1',
titleIcon:'./images/index_3_title.png',
swiperImgList:[
'./images/index_3_ban.png',
'./images/sss.png',
'./images/index_3_ban.png'
]
},
{
id:'1002',
title:'测试2',
titleIcon:'./images/index_4_title.png',
swiperImgList:[
'./images/index_3_ban.png',
'./images/sss.png',
'./images/index_3_ban.png'
]
},
];
遍历展示
page03ShowList:function(list){
for(let j =0;j<list.length;j++){
var appendStr = "";
appendStr += `<div class="box_content">
<div class="box_con_right">
<ul></ul>
<div class="toleft"><img src="./images/index_3_left.png"></div>
<div class="toRight"><img src="./images/index_3_right.png"></div>
</div>
</div>`
$(".box_md").append(appendStr);
for(let s =0;s<list[j].swiperImgList.length;s++){
var appendStrImg = "";
appendStrImg += `<li>
<img src="`+list[j].swiperImgList[s]+`">
</li>`
$(".box_content .box_con_right ul").append(appendStrImg);
}
}
},
调用之后会出现的问题:在第一个box_content盒子的ul中同样会显示测试2中的 swiperImgList 里边的图片,
解决方法:在向ul中添加的时候添加上 eq() ,固定一下。
page03ShowList:function(list){
for(let j =0;j<list.length;j++){
var appendStr = "";
appendStr += `<div class="box_content">
<div class="box_con_right">
<ul></ul>
<div class="toleft"><img src="./images/index_3_left.png"></div>
<div class="toRight"><img src="./images/index_3_right.png"></div>
</div>
</div>`
$(".box_md").append(appendStr);
for(let s =0;s<list[j].swiperImgList.length;s++){
var appendStrImg = "";
appendStrImg += `<li>
<img src="`+list[j].swiperImgList[s]+`">
</li>`
$(".box_content .box_con_right ul").eq(j).append(appendStrImg);
}
}
},