exploring state and events - part 4

dropdown/src/dropdown.jsx

@@ -4,13 +4,16 @@
 
 var React = require('react');
 var Button = require('./button');
-// var List = require('./list');
+var ListItem = require('./list-item');
 
 module.exports = React.createClass({
   handleClick: function() {
     alert('hello from dropdown');
   },
   render: function() {
+    var list = this.props.items.map(function(item){
+      return <ListItem item={item} />
+    });
 
     return <div className="dropdown">
       <Button
@@ -19,6 +22,9 @@ module.exports = React.createClass({
         title={this.props.title}
         subTitleClassName="caret"
         />
+      <ul>
+        {list}
+      </ul>
     </div>
   }
 });

dropdown/src/list-item.jsx

@@ -0,0 +1,7 @@
+var React = require('react');
+
+module.exports = React.createClass({
+  render: function() {
+    return <li><a>{this.props.item}</a></li>
+  }
+});