Reactjs React引导-在同一页面上处理多个模态

我有一个具有如下渲染方法的组件：

<ListGroup>
  {myarray.map(function(item, k) {
    return (
      <ListGroupItem
        key={item._id}
        bsStyle={item.status==='FAIL'?'danger':null}
        >
        Hello world
        &nbsp;
        <button onClick={showModal}>Open Modal</button> 
      </ListGroupItem>
    );
  })}
</ListGroup>

{myarray.map（函数（项，k）{
返回(
你好，世界
开放模态
);
})}

我想在点击按钮时显示模式，并显示文本打开模式。按钮将有许多列表项，但是模式的内容将不同，它是从

myArray

动态填充的

---

我被困在这里了，因为

react bootstrap

modal需要

show

状态，我不知道如何从同一页面上的多个modal中处理该状态。

您可以将

ListGroupItem

抽象为它自己的类，该类赋予它自己的状态。这将为每个项目生成一个模式。如果您只需要一个模式，也许可以将

k

变量传递给

onClick

侦听器，然后在模式中管理输出。