0

This is my current code which shows up a hamburger menu.

 <div className="navlines">
   <span></span>
   <span></span>
   <span></span>
 </div> 

I want to add a new class "open" to the existing class "navlines". how can i do this in react. i just started learning react a few days ago.

2 Answers 2

1

You can use something like this

<div className={"navlines " + (this.props.showHamburgerMenu ? 'open' : 'close')}>

When the value of showHamburgerMenu is true , the open class will be added otherwise close class will be there.

You can either use from props or from state i.e

<div className={"navlines " + (this.state.showHamburgerMenu ? 'open' : 'close')}>

Based on some click or a user action , you can set the state of showHamburgerMenu to true.

fiddle https://jsfiddle.net/jbh1qgzu/1/

Sign up to request clarification or add additional context in comments.

Comments

1

just do as in html.

<div className="navlines open">

if you want to do it dynamically based on some condition you can

var className = "navlines" + (condition ? " open" : "");
return (<div className={ className } />);

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.