打开Modal时从API获取当前数据

Question

我制作了一个组件，在其中使用提取API，然后呈现该数据，但是当我单击当前对象或在当前对象上与我们联系时，它会同时返回控制台中的对象ID和其中的最后一个ID。模态弹出。我的逻辑。

  componentDidMount() {
    this.showTitle();
    fetch("https://api.myjson.com/bins/6m0pe/")
      .then(res => res.json())
      .then(resData =>
        this.setState({
          isLoaded: true,
          items: resData
        })
      );
  }

{this.state.items.map((data, index) => {
                return (
                  <>
....
<Button onClick={this.open}>Contact us</Button>
                      <Modal show={this.state.show} onClose={this.close}>
                        <Modal.Content>
                          <Section style={{ backgroundColor: "white" }}>
                            Current ID : {console.log(data.id)}
                          </Section>
                        </Modal.Content>
                      </Modal>
                    </Columns.Column>
                  </>
                );
              })}

如何在按钮的onclick事件中获取特定的对象数据？

即使我单击第一个ID，这也是Modal的样子：预期输出应为DR001