最终结果UI
所以我有这些数据
var arr = [1,2,3,4,5,6,7,8]
我想要检查数组索引是否是5的倍数,所以每次循环在索引0、5、10等位置时,它将打印这个html <div class="slide-item"><div>{data}</div></div>
但当它不在索引0、5、10等位置时(意味着它在1、2、3、4、6、7、8等位置),它将打印
<div class="slide-item"><div>{data 1}</div><div>{data 2}</div></div><div class="slide-item"><div>{data 3}</div><div>{data 4}</div></div>
所以基本上最终结果的UI就像附图一样。
我的第一个尝试是这样的
{arr.map((res, index) => {return ({index % 5 === 0 ? (<div className="slide-item"><div>{res}</div></div>): (<div class="slide-item"><div>{data 1}</div><div>{data 2}</div></div>)}
我不太确定如何做,如果有人能帮忙,将不胜感激!
P粉1079910302024-03-28 00:03:22
我认为你需要根据res
来检查条件,因为索引始终从0开始
试试这个
{ arr.map((res, index) => { return ( res % 5 === 0 ? <div className="slide-item"><div>{res}</div></div> : <div> <div class="slide-item"><div>{data 1}</div> <div>{data 2}</div></div> </div> ) }) }