Optimal animation toggling with react.

React.js Animation Toggle

import React, { Component } from 'react';

class Toggle extends Component {
	constructor() {
		super()
		
		this.state = {
			collapsed: true
		};
	}

	toggleAnimation() {
		const collapsed = !this.state.collapsed;
		this.setState( { collapsed } );
	}

	render() {
    const { collapsed } = this.state; 
		const navClass = collapsed ? ‘collapse’ : ‘’;
		
		return (
      <button onClick={this.toggleAnimation.bind(this)}></button>
			<nav class=“nav ” + navClass>
				<ul>
					<li />
					<li />
					<li />
				</ul>
			</nav>
		);
	}

}

export default Toggle;