如何使用 reactjs 显示内容而不显示按钮？

Question

我的目标是在我们单击 emailid 时仅显示 email 组件（而不是显示按钮，即“显示模式”）。 我的意思是当我们点击 email id 时，模态应该弹出而不是显示按钮“显示模态”。 谁能帮我解决这个问题？

这是代码：

<Table.Body>
  <Table.Row>
    <Table.Cell>First Name</Table.Cell>
    <Table.Cell>
      <Link to="/Email">abc@yahoo.com</Link>
    </Table.Cell>
    <Table.Cell>01-01-2020</Table.Cell>
  </Table.Row>
</Table.Body>

这是整个代码：“ https://codesandbox.io/s/so-answer-60873116-98xnt ”

谁能帮我解决这个问题？

Answer 1

您想添加一个open的 state 并在关闭时重定向到 root，所有这些都使用Modal组件的open属性：

<Container>
  <Modal
    open={this.state.open}
    onClose={() => {
      this.setState({ open: false });
    }}
  >
   ...
  </Modal>
  {!this.state.open && <Redirect to={`/`} />}
</Container>

请参阅附加的沙箱