Oppgave: Lage chatvarsling

La oss utvikle en mekanisme for å vise en varsling kun når en bruker har uleste meldinger. Vi skal kontrollere om brukeren har noen uleste meldinger. Hvis denne betingelsen er sann, viser vi en varsling som indikerer antall meldinger. Hvis brukeren ikke har noen meldinger, viser vi ingenting.

Oppgaven er:

• Lag to komponenter: App som foreldreakomponent og Notification som barnekomponent.
• Foreldreakomponenten, App, skal sende en prop kalt messages til barnekomponenten. messages-propen er et array som inneholder meldinger. I barnekomponenten må du sjekke lengden på messages-arrayet.
• Hvis det finnes meldinger i arrayet, vis en streng som sier: You have <amount> of unread messages. Her skal <amount> erstattes med det faktiske antallet uleste meldinger.

1. For å finne ut om det finnes meldinger i arrayet, kan vi sjekke length-egenskapen. Syntaksen er - array.length.
2. I React bruker vi operatoren && for å implementere logikken til en if-setning.
3. For å sette sammen strengen riktig, erstatt plassholderen amount med faktisk lengde på arrayet.
4. Bruk krøllparenteser {array.length} for å sette inn lengden på arrayet i strengen.