Reactjs jsx中的条件交替父标记

用例：

array.map((field, index) =>{
  const Wrapper = index % 2 === 0 ? <RowWrapper> : <React.Fragment>
  return (
    <Wrapper>
      <Col md={4}>
      </Col>
      <Col md={2}>
      </Col>
    </Wrapper>
  );
})

array.map（（字段，索引）=>{
常量包装器=索引%2==0？：
返回(
);
})

预期产出：

<RowWrapper>
  <Col md={4}>
  </Col>
  <Col md={2}>
  </Col>
  <Col md={4}>
  </Col>
  <Col md={2}>
  </Col>
</RowWrapper>

---

在上述场景中。基本上，我希望map返回一个开始的

RowWrapper

标记，但在映射完两个字段之前不返回结束标记。

不幸的是，我不相信JSX可以完全按照这种方式工作，在这种方式中，结束标记是有条件地呈现的。但是，如果您巧妙地使用

map

回调，输出仍然是可以实现的：

array.map（（字段，索引）=>{
如果（索引%2==0）{
返回(
当前内容为{array[index]}
下一个索引内容是{array[index+1]}
);
}
return null；//如果这不是偶数索引，只需跳过
})

---

我还没有测试过，但是类似的东西应该可以实现您想要的输出。显然，您希望添加按一种类型检查关闭的场景。

在我回答后，您更改了预期输出；新的预期输出代码与您描述的文本不完全匹配--您能澄清一下吗？@AlexanderNied我需要为每个

字段

项设置两个引导列。一个用于输入，一个用于弹出按钮。