The event management example that we looked at is very simple, but it only shows the basics of React event management. This example does not involve the state, and its management is straightforward. In many real-world cases, an event causes changes to the application's state, and that means changes to the component's state.
Suppose that, for example, you want to allow the selecting of products from the catalog. To do so, we add the selected property to each product object, as shown in the following array:
[ {"code":"P01", "name": "Traditional Merlot", "description": "A bottle of middle weight wine, lower in tannins (smoother), with a more red-fruited flavor profile.", "price": 4.5, "selected": false}, {"code":"P02", ...