Reactstrap Navbar Menu: как добавить ссылку в DropdownToggle? - PullRequest
0 голосов
/ 01 апреля 2020

Вместо того, чтобы нажимать <DropdownItem> Я хочу прикрепить ссылку также к. Что-то вроде: <DropdownToggle nav caret className="nav-link dropdown-toggle" to="/jobs">

<header className={navbarClass}>
  <Navbar className="navbar navbar-expand-lg navbar-scroll ">
    <Link className="mr-auto navbar-brand" to="/">
      <Img fixed={website.logo.childImageSharp.fixed} className="main-logo" alt={siteTitle} title={siteTitle}  />
    </Link>
    <button aria-label="Toggle navigation" type="button" className="mr-2 navbar-toggler" onClick={toggleNavbar}>
      {!collapsed? <span className="close-mob"><FontAwesomeIcon icon={faTimes}/></span>:
        <>
          <span className="navbar-toggler-icon"></span>
          <span className="navbar-toggler-icon"></span>
          <span className="navbar-toggler-icon"></span>
        </>
      }
    </button>
    <Collapse isOpen={!collapsed} navbar>
      <Nav navbar>
        <ButtonDropdown  nav inNavbar isOpen={firstDropIsOpen} onClick={handleFirstDropdown}>
          <DropdownToggle nav caret className="nav-link dropdown-toggle" href="/who-we-are">
            who we are
          </DropdownToggle>
          <DropdownMenu className="dropdown-menu" >
            <DropdownItem>
              <Link className="dropdown-item" to="/who-we-are">The company</Link>
            </DropdownItem>
            <DropdownItem>
              <Link className="dropdown-item" to="/who-we-are#the-team">The team</Link>
            </DropdownItem>
            <DropdownItem>
              <Link className="dropdown-item" to="/who-we-are#our-reach">Our reach</Link>
            </DropdownItem>
            <DropdownItem>
              <Link className="dropdown-item" to="/who-we-are#our-clients">our clients</Link>
            </DropdownItem>
            <DropdownItem>
              <Link className="dropdown-item" to="/who-we-are/our-sectors">Our sectors</Link>
            </DropdownItem>
          </DropdownMenu>
        </ButtonDropdown>

        <ButtonDropdown  nav inNavbar isOpen={secondDropIsOpen} onClick={handleSecondDropdown}>
          <DropdownToggle nav caret className="nav-link dropdown-toggle" to="/what-we-do">
            what we do
          </DropdownToggle>
          <DropdownMenu className="dropdown-menu" >
            <DropdownItem>
              <Link className="dropdown-item"  to="/what-we-do#executive-search">Executive Search</Link>
            </DropdownItem>
            <DropdownItem>
              <Link className="dropdown-item" to="/what-we-do#non-executive-directors">Non Executive Directors</Link>
            </DropdownItem>
            <DropdownItem>
              <Link className="dropdown-item" to="/what-we-do#interim-executive-positions">Interim Executive Positions</Link>
            </DropdownItem>
            <DropdownItem>
              <Link className="dropdown-item" to="/what-we-do#talent-mapping">Talent Mapping</Link>
            </DropdownItem>
          </DropdownMenu>
        </ButtonDropdown>
        <NavItem>
          <Link className="nav-link" activeClassName="active" to="/how-we-do-it">how we do it<span className="sr-only">(current)</span></Link>
        </NavItem>

        <ButtonDropdown  nav inNavbar isOpen={thirdDropIsOpen} onClick={handleThirdDropdown}>
          <DropdownToggle nav caret className="nav-link dropdown-toggle" to="/jobs">
            jobs
          </DropdownToggle>
          <DropdownMenu className="dropdown-menu" >
            <DropdownItem>
              <Link className="dropdown-item"  to="/jobs">Current Opportunities</Link>
            </DropdownItem>
            <DropdownItem>
              <Link className="dropdown-item" to="/jobs/previous-assignments">Previous Assignments</Link>
            </DropdownItem>
          </DropdownMenu>
        </ButtonDropdown>

        <NavItem>
          <Link className="nav-link" activeClassName="active" to="/insights">insights<span className="sr-only">(current)</span></Link>
        </NavItem>
        <NavItem>
          <Link className="nav-link" activeClassName="active" to="/contact-us">contact us<span className="sr-only">(current)</span></Link>
        </NavItem>
      </Nav>
    </Collapse>
  </Navbar>
</header>
...