React Design Patterns and Best Practices - Second Edition

Using the state

Now that we know how the state works, it is important to understand when it should be used and when we should avoid storing a value in the state.

If we follow the rules, we can easily figure out when a component should be stateless or stateful, and how to deal with the state to make our component reusable across the application.

First of all, we should always keep in mind that only the minimal amount of data needed should be put into the state.

For example, if we have to change a label when a button is clicked, we should not store the text of the label, but we should only save a Boolean flag that tells us if the button has been clicked or not.

In that way, we are using the state properly, and we can always recalculate different ...