From 507f5935e674f9e4d1585db423c5b9efd93be3d7 Mon Sep 17 00:00:00 2001
From: Vedat Mahir YILMAZ <mahir@vedatmahir.com>
Date: Sun, 22 May 2016 12:32:14 +0300
Subject: [PATCH] Interactivity and Dynamic UIs Docs page updated with ES6
 Example (#6832)

* Interactivity and Dynamic UIs Pages ES6 Example

* Change bind handler
---
 docs/03-interactivity-and-dynamic-uis.md | 26 ++++++++++++++----------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/docs/03-interactivity-and-dynamic-uis.md b/docs/03-interactivity-and-dynamic-uis.md
index ebc7980c..424c2157 100644
--- a/docs/03-interactivity-and-dynamic-uis.md
+++ b/docs/03-interactivity-and-dynamic-uis.md
@@ -11,22 +11,26 @@ You've already [learned how to display data](/react/docs/displaying-data.html) w
 ## A Simple Example
 
 ```javascript
-var LikeButton = React.createClass({
-  getInitialState: function() {
-    return {liked: false};
-  },
-  handleClick: function(event) {
+class LikeButton extends React.Component {
+  constructor() {
+    super();
+    this.state = {
+      liked: false
+    }
+    this.handleClick = this.handleClick.bind(this);
+  }
+  handleClick() {
     this.setState({liked: !this.state.liked});
-  },
-  render: function() {
-    var text = this.state.liked ? 'like' : 'haven\'t liked';
+  }
+  render() {
+    const text = this.state.liked ? 'like' : 'haven\'t liked';
     return (
-      <p onClick={this.handleClick}>
+      <div onClick={this.handleClick}>
         You {text} this. Click to toggle.
-      </p>
+      </div>
     );
   }
-});
+}
 
 ReactDOM.render(
   <LikeButton />,