Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- class MenuButton extends Component {
- constructor (props) {
- super (props)
- this.state = {showMenu: false}
- this.toggleMenu = this.toggleMenu.bind(this)
- }
- toggleMenu () {
- let showMenu = !this.state.showMenu
- this.setState({showMenu})
- }
- componentDidMount () {
- window.addEventListner('click', e => {
- if (e.target !== document.getElementById('menu-div') {
- this.setState({showMenu: false})
- }
- })
- }
- render () {} {
- return (
- <div>
- <button onClick={this.toggleMenu}>Menu</button>
- {this.state.showMenu ? <div id='menu-div><Menu /></div> : null}
- </div>
- )
- }
- }
- const Menu = () => {
- return (
- <div>
- <Component1/>
- <Component2/>
- <Component3/>
- </div>
- )
- }
- componentDidMount () {
- window.addEventListner('click', e => {
- if (e.target !== this.refOfMenu && !this.refOfMenu.contains(e.target)) {
- this.setState({showMenu: false})
- }
- })
- }
Add Comment
Please, Sign In to add comment