Creating the TweetList component
As you know, our Collection
component has two child components: CollectionControls
and TweetList
.
We'll first build the TweetList
component. Create the following ~/snapterest/source/components/TweetList.react.js
file:
var React = require('react'); var Tweet = require('./Tweet.react.js'); var listStyle = { padding: '0' }; var listItemStyle = { display: 'inline-block', listStyle: 'none' }; var TweetList = React.createClass({ getListOfTweetIds: function () { return Object.keys(this.props.tweets); }, getTweetElement: function (tweetId) { var tweet = this.props.tweets[tweetId]; var handleRemoveTweetFromCollection = this.props.onRemoveTweetFromCollection; var tweetElement; if (handleRemoveTweetFromCollection) { tweetElement = ( <Tweet tweet={tweet} onImageClick={handleRemoveTweetFromCollection} /> ); } else { tweetElement = <Tweet tweet={tweet} />; } return...