2 way binding with inputs on card

bottega-code-school · May 17, 2018 · 7a05701 · 7a05701
1 parent 892cf7e
commit 7a05701
Showing 1 changed file with 6 additions and 4 deletions.
diff --git a/src/components/card.js b/src/components/card.js
@@ -11,18 +11,20 @@ class Card extends Component {
             color: 'BLUE',
             pluralNoun: ''
         }
-    }
 
-    handleInputChange() {
-        this.setState({ color: 'red' })
+        this.handleInputChange = this.handleInputChange.bind(this);
+    } 
+
+    handleInputChange(event) {
+        this.setState({ color: event.target.value })
     }
 
     render() {
 
         return (
             <div className="card">
                 <h1>{this.state.color}</h1>
-                <input/>
+                <input value={this.state.color} onChange={(event) => this.handleInputChange(event)}/>
             </div>
         )