Javascript 如何在查看react和making元素中的列表时生成引导行

我现在就是这样做的——这是非常不合理的，而且不起作用。我越来越

TypeError: Cannot read property '0' of undefined
at grid.push(<Card key={index+x} name={list[index+x][0]} img={list[index+x][1]}/>);

TypeError:无法读取未定义的属性“0”
在grid.push（）处；

这是我的密码

const list = // my list of data
        var grid = [];
        list.map((element, index) => {
            if (index%4 == 0) {
                if (index<list.length-2) {
                const el = (<div className="row">
                //card being a component I built
                <Card key={index} name={element[0]} img={element[1]}/>
                <Card key={index+1} name={list[index+1][0]} img={list[index+1][1]}/>
                <Card key={index+2} name={list[index+2][0]} img={list[index+2][1]}/>
                <Card key={index+3} name={list[index+3][0]} img={list[index+3][1]}/>
                </div>)
                grid.push(el);
                } else {
                    let remainder = (list.length-index);
                    for (var x=0;x+=1;x<remainder) {
                        grid.push(<Card key={index+x} name={list[index+x][0]} img={list[index+x][1]}/>);
                    }
                }

            }
        })\
        return (
        <div>
            {grid}
        </div>
        )

const list=//我的数据列表
var网格=[]；
list.map（（元素，索引）=>{
如果（索引%4==0）{
如果（index您使用的是index+1、index+2、index+3，当您到达最后一个元素时，它们将永远不存在于数组中。
相反，在其他变量中计算它，以找到存在的元素。
更大的问题是，我需要每4行生成一行引导，但我只想迭代并为每个行生成一张卡片。我有点像你所说的那样，计算余数并将卡片推到网格上。你只需在外部添加一行，然后通过用col-md-3 list.map（（元素，索引）=>{const el=（）grid.push（el）；}{grid}谢谢，解决方案是停止疯狂的算法，只需循环并添加它！你能在列表变量中发布数据吗？