Arrays 映射函数中的额外div包装器

我需要为React中的第二个和第三个元素创建额外的div包装器

我使用一个映射函数，但我不知道如何修复它。 这是一个沙箱

这是我需要实现的目标

另一屏幕：

---

您需要将渲染方法中的代码更改为

 if (index !== 0) {
    return (
      <div key={index} className="second_wrapper">
        <h1 >{index}</h1>
      </div>
    );
  } else ....

编辑：

您需要将代码更改为：

render() {
const { members } = this.state;
return (
  <div>
    <div className="first_wrapper">
      <h1 key={0}>{members[0].name}</h1>
    </div>
    <div className="second_wrapper">
      {members.map((m, i) => {
        if (i > 0) return <h1 key={i}>{m.name}</h1>;
      })}
    </div>
  </div>
);

}

---

它不是我的解决方案，因为我只需要一个包装名称第二个包装，在它里面我需要两个arrayOk对象。如果我理解正确的话，第一个元素必须与类first_wrapper一起位于div中，而所有其他元素必须与类second_wrapper一起位于div中？@Pio您刚刚删除了您的评论，声明此答案符合您的要求。@非常感谢您的时间和解决方案，但这并不是我真正需要的。它只是沙盒中的一小段代码。我从Api得到一个数据，我需要一个循环。例如，当我们的arr中有6个obj时，行为必须是相同的。第一个对象包装->第一个对象第二个对象包装->第二个和第三个对象第一个对象包装->第四个对象第二个对象包装->第五个和第六个obj@sn42我添加了一个anwser，它是关于很好地理解我的问题而不是解决我的问题对不起，我的badAn图像，你的代码构成了糟糕的格式，很容易被否决。