React: Building Modern Web Applications

Refactoring the CollectionRenameForm component

CollectionRenameForm is a controlled form component. This means that its input value is stored in the component's state, and the only way to update that value is to update the component's state. It has the initial value that it should get from CollectionStore, so let's make that happen.

First, we need to import the CollectionActionCreators and CollectionStore modules:

var CollectionActionCreators = require('../actions/CollectionActionCreators');
var CollectionStore = require('../stores/CollectionStore');

Now, we need to update the getInitialState() method as follows:

getInitialState: function() {
  return {
     inputValue: this.props.name
  };
},

Now we change it to this code snippet:

getInitialState: function() ...