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() { return { inputValue: CollectionStore.getCollectionName() }; },
As you can see, the only difference is that now we get the initial inputValue
from CollectionStore
.
Next, let's update the handleFormSubmit()
method by using the following...