1function ActionLink() {
2 function handleClick(e) { e.preventDefault(); console.log('The link was clicked.'); }
3 return (
4 <a href="#" onClick={handleClick}> Click me
5 </a>
6 );
7}
1class Toggle extends React.Component {
2 constructor(props) {
3 super(props);
4 this.state = {isToggleOn: true};
5
6 // This binding is necessary to make `this` work in the callback this.handleClick = this.handleClick.bind(this); }
7
8 handleClick() { this.setState(state => ({ isToggleOn: !state.isToggleOn })); }
9 render() {
10 return (
11 <button onClick={this.handleClick}> {this.state.isToggleOn ? 'ON' : 'OFF'}
12 </button>
13 );
14 }
15}
16
17ReactDOM.render(
18 <Toggle />,
19 document.getElementById('root')
20);