使用 React Bootstrap 选项卡响应嵌套路由

Question

我想将路由添加到我的画廊。我在我的页面上使用 Bootstrap 标签，每个标签都有不同的轮播，用于不同类别的图片。我想添加路由，以便用户不会下载所有图片，而只会下载他选择的部分。

所以我将这种方法用于 Tab.Container、Tab.Content、Tab.Pane。当用户选择每个链接时，#category 会添加到链接中，但我的 Route 不会加载组件，甚至不会呈现简单的文本。不知道怎么回事。

幻灯片被包装在带有适当 eventKey 的 Tab.Pane 中

图库内容代码：

   const renderInformation = data.map((item) => (
    <Card
      key={item.id}
      title={item.name}
      actions={[{ content: "Details" }]}
    >
      <Card.Section>
        <Stack>
          {item.status == 'enabled' && <Badge status="success">Enabled</Badge> }
          {item.status == 'paused' && <Badge status="attention">Paused</Badge> }
        </Stack>
      </Card.Section>
    </Card>
  ));