great. works. thanks

Hello,

Yes, you are right. Nav link component has a bad structure. We have a workaround about that and we added prop link what changes a nav link to normal link from react-router-dom and there is no reference to URL address about that and there is no problem with class active.

We will release new component call 'MDBLink which will solve this issue with 5.0.0 version ( probably in 20th of January)

Try this code:

  <div className="classic-tabs">
    <MDBNav classicTabs color="orange" className="">
      <MDBNavItem>
        <MDBNavLink link to="#" active={activeItemClassicTabs3==="1"} onClick={() => toggleClassicTabs3("1")}>
          <MDBIcon icon="user" size="1x" />
          <br />
          Info
        </MDBNavLink>
      </MDBNavItem>
      <MDBNavItem>
        <MDBNavLink link  to="#" active={activeItemClassicTabs3==="2"} onClick={() => toggleClassicTabs3("2")}>
          <MDBIcon icon="heart" size="1x" />
          <br />
          Sureys
        </MDBNavLink>
      </MDBNavItem>
      <MDBNavItem>
        <MDBNavLink link  to="#" active={activeItemClassicTabs3==="3"} onClick={() => toggleClassicTabs3("3")}>
          <MDBIcon icon="user" size="1x" />
          <br />
          Tiles
        </MDBNavLink>
      </MDBNavItem>
      <MDBNavItem>
        <MDBNavLink link to="#" active={activeItemClassicTabs3==="4"} onClick={() => toggleClassicTabs3("4")}>
          <MDBIcon icon="heart" size="1x" />
          <br />
          Models
        </MDBNavLink>
      </MDBNavItem>

    </MDBNav>