React Quickly, Second Edition

5 Making React interactive with states

This chapter covers

• The role of state in a component
• Using state in functional components
• Converting stateful class-based components to functional components

All the components we’ve created so far take some properties and render some HTML based on those properties. We can pass a label property to a button, so the button is displayed with that exact button text, for instance. But we can’t make the button text change when something happens, such as changing between Turn On and Turn Off when toggled. That’s because we lack both the ability to react to something that happens and the ability to store the single piece of information that something has changed dynamically.

The output of the components we’ve ...