Blockchain Development for Finance Projects

Using the componentDidMount() method to map the Shoes array

Within the componentDidMount method, we map the Shoes constant to our state variables, as shown here. We fetch the individual shoe details from the Shoes.js file that we declared earlier:

Shoes.forEach((shoe) => { let logo = shoe.logo; let price = shoe.price; let image = shoe.image; let name = shoe.name;

Each individual shoe is mapped in the shoes array and pushed to the state as shown in the following. From here, we will retrieve it within the Shoerack component:

shoes.push({ logo, price, name, image, });  app.setState({ shoes  }) });

After each push, we set the app state to show a new product on the e-commerce website. Let's take a look at our App.js render method next.