如何在Semantic-UI-React中响应表？

Question

现在我有一张长而宽的桌子。它占据了网格中的所有16个点，看起来不错，但是当我将某些数据覆盖到Table.cell时。它会破坏桌子的宽度。像这样：

有人能帮助我解决这个问题吗？

 <Table>
  <Table.Body>
    <Table.Row>
      <Responsive as={Table.Cell} minWidth={Responsive.onlyMobile.minWidth}>
      Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
      </Responsive>
      <Responsive as={Table.Cell} minWidth={Responsive.onlyMobile.minWidth}>Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd</Responsive>
      <Responsive as={Table.Cell} minWidth={Responsive.onlyMobile.minWidth}>
        <Responsive
          as={Table.Cell}
          minWidth={Responsive.onlyMobile.minWidth}
        >
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
        </Responsive>
      </Responsive>
    </Table.Row>
  </Table.Body>
</Table>

Answer 1

您是否尝试过将style={{ overflow: auto }}添加到<Table.body />