Book Image

React.js Essentials

By : Artemij Fedosejev
Book Image

React.js Essentials

By: Artemij Fedosejev

Overview of this book

Table of Contents (18 chapters)
React.js Essentials
Credits
Foreword
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Refactoring the Collection component


Next, let's refactor our Collection component. Replace the existing Collection component with an updated one:

var React = require('react');
var ReactDOMServer = require('react-dom/server');
var CollectionControls = require('./CollectionControls.react');
var TweetList = require('./TweetList.react');
var Header = require('./Header.react');
var CollectionUtils = require('../utils/CollectionUtils');
var CollectionStore = require('../stores/CollectionStore');

var Collection = React.createClass({

  getInitialState: function () {
    return {
      collectionTweets: CollectionStore.getCollectionTweets()
    }
  },

  componentDidMount: function () {
    CollectionStore.addChangeListener(this.onCollectionChange);
  },

  componentWillUnmount: function () {
    CollectionStore.removeChangeListener(this.onCollectionChange);
  },

  onCollectionChange: function () {
    this.setState({
      collectionTweets: CollectionStore.getCollectionTweets()
    });
  },
...