MDBReact - SideNavCat - how to make onClick handler work?

Topic: MDBReact - SideNavCat - how to make onClick handler work?

tomasz1253 pro asked 6 years ago

Hi! I want to add some additional behaviour to SideNavCat in MDBReact. Here is code fragment from SideNav MDBReact example:

<SideNavCat id="instruction-cat" name="Instruction" icon="hand-pointer-o" href="#">
  <SideNavLink>For bloggers</SideNavLink>
<SideNavLink>For authors</SideNavLink>
</SideNavCat>

I want to add onClick handler, (example below) to SideNavCat but its not even triggered :/

<SideNavCat onClick={this.exampleFunction} id="instruction-cat" name="Instruction" icon="hand-pointer-o" href="#">
  <SideNavLink>For bloggers</SideNavLink>
  <SideNavLink>For authors</SideNavLink>
</SideNavCat>

When I'm clicking on SideNavCat this.exampleFunction is not being fired. How to fire onClick before SideNavLinks inside SideNavCat appear? I also find out that the same goes for SideNavLink onClick handler on SideNavLinks doesnt work. How can I make it work also for SideNavLinks?

Add comment

Jakub Mandra staff premium answered 6 years ago

1 0 Best answer

<SideNavLink to="/route4">Link</SideNavLink>

it is the react-routers <Link> component.

You can use <SideNavItem> which renders simple <a> component, or you can add 'tag' property which will replace this component.

<SideNavItem onClick={this.sideNavItemClick}>Instruction</SideNavItem>

Regards, Jakub

tomasz1253 pro commented 6 years ago

Now it's working, thank you :)

Add comment

Jakub Mandra staff premium answered 6 years ago

1 0 Best answer

Hello, Those components have onClick handler already set (open/close functionality), so you can't add another one. What do you want to achieve? Maybe we will find another solution? Best regards, Jakub

tomasz1253 pro commented 6 years ago

I want to change component State in which SideNav is. For example calculate something and show in diffrent component. Is it possible to fire some kind of Event from them? If not - then how to change route or/and (if possible) hash value? Will it be possible in future releases? Best, Tomek

Add comment

Write

Create snippet

FREE CONSULTATION

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

Status

Resolved

Specification of the issue

User: Pro
Premium support: No
Technology: MDB React
MDB Version: 4.7.0
Device: Any
Browser: Any
OS: Any
Provided sample code: No
Provided link: No

tomasz1253

Pro User

15Support score
3Questions 0Answers

0Snippets likes 0Snippets