Skip to content

Instantly share code, notes, and snippets.

@rajatk16
Last active March 13, 2019 21:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save rajatk16/0d52d8cc197ab8e9331cdb745ea93dcf to your computer and use it in GitHub Desktop.
Save rajatk16/0d52d8cc197ab8e9331cdb745ea93dcf to your computer and use it in GitHub Desktop.
import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import cx from 'classnames';
import './index.css';
class App extends Component {
state = {
display: false,
};
toggle = () => {
this.setState(prevstate => ({
display: !prevstate.display,
}));
};
render() {
return (
<div className="container">
<button
className={cx('toggler', {
'toggler--active': this.state.display,
})}
onClick={this.toggle}>Show</button>
{this.state.display && (
<div className="menu">
<ul className="list">
<li className="list-item">Rajat</li>
<li className="list-item">Writes Posts</li>
<li className="list-item">Loves Pizza</li>
</ul>
</div>
)}
</div>
)
}
}
ReactDOM.render(<App/>, document.getElementById('root'));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment