css - 修复了 react-semantic-ui 中的侧边栏

Question

我在 react-semantic-ui 中有一个 Sidebar，它有一些指向其他页面、导航菜单的链接。它工作正常，只有当不同页面渲染不同尺寸的侧边栏尺寸也随之改变时。我想让侧边栏固定。这是我的代码:

return (
  url !== '/auth' && (
    <div>
      <Header />
      <Button secondary onClick={this.toggleVisibility}>
        منو{' '}
      </Button>
      <Segment>
        <Sidebar.Pushable as={Segment}>
          <Sidebar
            as={Menu}
            animation="push"
            width="wide"
            direction="right"
            visible={visible}
            icon="labeled"
            vertical
            inverted
          >
            <Nav {...{ navLinks }} />
          </Sidebar>
          <Sidebar.Pusher>
            <div>{navLinks.map(renderNavLink)}</div>
            <BlockerModal />
          </Sidebar.Pusher>
        </Sidebar.Pushable>
      </Segment>
    </div>
  )

我怎样才能固定侧边栏而不改变它在导航时的大小？

Answer 1

您可能正在使用 <Sidebar as={Menu}>没有实际使用任何 <Menu.Item>在你的里面 <Nav > .尝试将每个边栏元素包装在 <Menu.Item> 中