我有一些映射的json数据来在容器中显示结果。生成的html中的每个列表都必须打开一个单独的模式窗口。为此,我需要在生成的代码中将一个数字关联到每个data-toggle="modal"和每个data-target="exampleModal"。
我试着添加data-modal="modal${res[i]},但没有这样的数字。
生成的代码:
const res = some.d.results; //arr of objects
let ul = document.querySelector('#test');
const html = res.map(el=> {
for (i = 1; i < res.length; i++) {
return `<li class="box-top box-top--feat" type="button" data-toggle="modal${res[i]}" data-target="exampleModal${res[i]}">
<a class="box-top__content" href="#">
<div class="box-top__title__img2">
<img class="availableImgs" alt="" src="${res.dirRef}${'/'}${res.fileRef}" />
</div>
<h2 class="box-top__title">${res.PersonA.Person}</h2>
<h3 class="box-top__work">${res.Title}</h3>
</a>
</li>
<div class="modal fade" id="exampleModal${res[i]}" tabindex="-1">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body">
<p>${res.DescA.PersA]}</p>
</div>
</div>
</div>
</div>`;
}
}).join("");在这里加一个数字的正确方法是什么?
发布于 2022-08-09 17:10:59
您似乎要多次遍历res,一次用map(),一次用for(.)。但是,您的for-循环将在第一次迭代时返回,因此不会达到后续迭代。您可以在map():res.map((el,i) => {.}中包含一个索引,然后使用i实例,而不是单独的for-循环。
https://stackoverflow.com/questions/73294695
复制相似问题