Haaste: Tietokokoelmien Näyttäminen

Tehtävä: Näytä tuotelista

Käsittele taustajärjestelmästä saatu data ja varmista sen asianmukainen esittäminen listamuodossa.

Tehtävä:

• Hyödynnä map()-metodia tavaroiden taulukon renderöintiin.
• Täytä seuraavat kohdat:
  1. h2-elementissä tulee olla tuotteen nimi (name-ominaisuus);
  2. p-elementissä tulee olla tuotteen kuvaus (description-ominaisuus);
  3. span-elementissä tulee olla merkkijono "Price:" ja tuotteen hinta (price-ominaisuus).

1. Käytä map()-metodia käydäksesi läpi props.goods-taulukon.
2. Aseta key-elementin <li>-prop arvoksi yksilöllinen arvo, kuten tuotteen id-ominaisuus.
3. Jokaisen <li>-elementin sisällä käytä seuraavia elementtejä:
   • <h2>-elementti tuotteen nimen näyttämiseen. Hae nimi nykyisestä item:stä;
   • <p>-elementti tuotteen kuvauksen näyttämiseen. Hae kuvaus nykyisestä item:stä;
   • <span>-elementti merkkijonon "Price:" ja tuotteen hinnan näyttämiseen. Hae hinta nykyisestä item:stä.