MdbNavLink in MDBNav - get same wave effect and ripple with


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

Manamapps asked 6 months 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 6 months ago

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


Piotr Glejzer staff commented 6 months 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.
Status

Open

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: React
  • MDB Version: 4.25.3
  • Device: desktop
  • Browser: chrome
  • OS: windows 10
  • Provided sample code: No
  • Provided link: No
Tags