单击按钮即可打开Reactstrap模态

Question

我在reactstrap模态中遇到麻烦。我正在遍历一个数组，它制作了模式和按钮，并在一张漂亮的卡片中获取了信息。

现在，当我单击按钮以打开模态时，即使我没有单击卡上的按钮，所有模态也会打开。所有（39）打开。我希望大家能帮助我<3

模态

this.state= {
modal:false,
}

切换功能

toggle(){
this.setState(prevState =>({
  modal: !prevState.modal
}));
}

所有返回的内容

     return (
      <div key={item.ID}>
      <ul>
        <Modal isOpen={this.state.modal} toggle={this.modal} id={item.ID}>
          <ModalHeader id={item.ID} toggle={this.toggle}>{item.Naam}</ModalHeader>
          <ModalBody>fdass</ModalBody>
          <ModalFooter><Button onClick={this.toggle} color='primary'>fddss</Button></ModalFooter>
        </Modal>

        <Card style={{ width: '18rem' }}>
        {/* <CardImg src={"http://static.floraxchange.nl/artikelen/"+ item.Fotos.ID +"_v_t8.jpg"} alt={item.Naam} /> */}
          <Card.Body>
            <Card.Title>{item.Naam}</Card.Title>
            <Card.Text>
              Hoogte: {item.Hoogte}<br />
              Potmaat: {item.Potmaat} <br/>
              ID: {item.ID}
            </Card.Text>
            <Button color="danger" data-target={'#' + item.ID} onClick={this.toggle}>More information</Button>
          </Card.Body>
        </Card>
      </ul>
      </div>
    )