Topic: MdbNavLink in MDBNav - get same wave effect and ripple with out NavLink

Manamapps premium asked 2 years ago


Expected behavior Tab wont be an NAVLink tag because it send the url an event event if "to" = #. and that changes my state. But I still want to keep the wave effect, active effects and ripple effect.

Actual behavior clicking a tab sends the browser a url event that changes my state event if the url hasnt changed (to="#") Resources (screenshots, code snippets etc.)

        <MDBNav classicTabs color="orange">
      {tabs.map(tab => (
        <MDBNavItem>
          <MDBNavLink
            link
            // to="#"
            active={activeItemOuterTab === tab.name}
            onClick={toggleOuterTabs(tab.name)}
            role="tab"
          >
            <MDBIcon icon={tab.icon} /> {tab.name}
          </MDBNavLink>

        </MDBNavItem>
      ))}
                    {/* <div
            className={`tab Ripple-parent ${activeItemOuterTab ===
              tab.name && 'active'}`}
            onClick={toggleOuterTabs(tab.name)}
            role="tab"
          >
            {tab.name}
          </div> */}
    </MDBNav>

Piotr Glejzer staff commented 2 years ago

So to be precise, you didn't want to use mdbnavlink but still want to use all the effects?


Piotr Glejzer staff commented 2 years ago

So to be precise, you didn't want to use mdbnavlink but still want to use all the effects?



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Opened

Specification of the issue

  • User: Premium
  • Premium support: Yes
  • Technology: MDB React
  • MDB Version: 4.25.3
  • Device: desktop
  • Browser: chrome
  • OS: windows 10
  • Provided sample code: No
  • Provided link: No