userNotHere
userNotHere

Reputation: 97

React: Close hamburger menu when clicked on a link

I am trying to achieve the following scenario

Currently when a user clicks on the hamburger menu, then the user is navigated to the specific page, but when a user is on the home page and clicks on the home link from the menu, then the hamburger menu stays open. I want to dismiss/hide/close the menu even if the user is on the same page as they are clicking on the same link. For example: if the user is on home page and clicks on the home link from the menu, the menu should close. How can I achieve this

onLinkClick(){
    this.props.onItemClick(this.props.name, this.props.link);
}

onItemClick: () =>{

};

<SomeDiv onClick = {this.onLinkClick} link={this.props.link}>
    {this.props.name}
</SomeDiv >

Upvotes: 0

Views: 1036

Answers (1)

Alexander Vitanov
Alexander Vitanov

Reputation: 4141

Two options depending on your architecture:

  1. Pass down a function which toggles the drawer to the page and close it in onLinkClick

  2. [using Redux]: Keep the hamburger state (opened / closed) in a reducer and from onLinkClick dispatch an action creator to close it

Upvotes: 2

Related Questions