Add a state component

Author: brice

src/components/AddTodo.js

@@ -0,0 +1,23 @@
+var React = require('react');
+
+var AddTodo = React.createClass({
+  handleClick: function(e) {
+    var node = this.refs.input
+    var text = node.value.trim()
+    this.props.onAddClick(text)
+    node.value = ''
+  },
+  render: function() {
+    return (
+      <div>
+        <input type='text' ref='input' />
+        <button onClick={this.handleClick}>
+          Add
+        </button>
+      </div>
+    );
+  }
+});
+
+
+module.exports = AddTodo;

src/components/TodoApp.js

@@ -0,0 +1,16 @@
+import React from 'react'
+import TodoList from '../components/TodoList'
+import AddTodo from '../components/AddTodo'
+
+export default function TodoApp(props) {
+  return (
+    <div className="todoApp">
+      <AddTodo 
+        onAddClick={function(text) {
+          console.log(text)
+        }}
+      />
+      <TodoList data={props.data}/>
+    </div>
+  )
+}

src/containers/TodoApp.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import { render } from 'react-dom'
-import TodoApp from './components/TodoApp'
+import TodoApp from './containers/TodoApp'
 
 var data = [
   {id: 1, text: "Do The App", completed: 0},