diff --git a/todos/index.html b/todos/index.html
index 4a914cc..0a75d4a 100755
--- a/todos/index.html
+++ b/todos/index.html
@@ -8,6 +8,9 @@
.loaded {
opacity: 1;
}
+ .input-group {
+ margin-bottom: 15px;
+ }
diff --git a/todos/src/app.jsx b/todos/src/app.jsx
index b102fca..c0ecd1b 100755
--- a/todos/src/app.jsx
+++ b/todos/src/app.jsx
@@ -25,6 +25,7 @@ var App = React.createClass({
To-Do List
+
diff --git a/todos/src/list-item.jsx b/todos/src/list-item.jsx
new file mode 100644
index 0000000..aa03390
--- /dev/null
+++ b/todos/src/list-item.jsx
@@ -0,0 +1,25 @@
+var React = require('react');
+
+module.exports = React.createClass({
+ getInitialState: function() {
+ return {
+ text: this.props.item.text
+ }
+ },
+ render: function() {
+ return
+
+
+
+
+
+
+
+
+ }
+});
diff --git a/todos/src/list.jsx b/todos/src/list.jsx
index d3152b1..2484026 100644
--- a/todos/src/list.jsx
+++ b/todos/src/list.jsx
@@ -1,10 +1,11 @@
var React = require('react');
+var ListItem = require('./list-item');
module.exports = React.createClass({
render: function() {
- return
+ return
{this.renderList()}
-
+
},
renderList: function() {
if(this.props.items && Object.keys(this.props.items).length === 0) {
@@ -15,10 +16,15 @@ module.exports = React.createClass({
var children = [];
for(var key in this.props.items) {
+ var item = this.props.items[key];
+ item.key = key;
+
children.push(
- -
- {this.props.items[key].text}
-
+
+
)
}