Udfordring: Implementer Betinget Rendering i Chatnotifikation
Opgave: Opret chatnotifikation
Udarbejd en mekanisme, der kun viser en notifikation, når en bruger har ulæste beskeder. Vi skal kontrollere, om brugeren har nogen ulæste beskeder. Hvis denne betingelse er opfyldt, vises en notifikation, der angiver antallet af beskeder. Hvis brugeren ikke har nogen beskeder, vises der intet.
Opgaven er:
- Opret to komponenter:
Appsom forældrekomponent ogNotificationsom barnekomponent. - Forældrekomponenten,
App, skal videregive en prop kaldetmessagestil barnekomponenten.messages-proppen er et array, der indeholder beskeder. I barnekomponenten skal du kontrollere længden afmessages-arrayet. - Hvis der er nogen beskeder i arrayet, vis en streng, der siger:
You have <amount> of unread messages.Her skal<amount>erstattes med det faktiske antal ulæste beskeder.
- For at afgøre, om der er beskeder i arrayet, kan vi kontrollere dets
lengthved hjælp af length-egenskaben. Syntaksen er -array.length. - I React bruger vi operatoren
&&til at implementere logikken fra enif-sætning. - For at konstruere strengen korrekt, skal du erstatte pladsholderen
amountmed den faktiske længde af arrayet. - Brug krøllede parenteser
{array.length}for at indsætte arrayets længde i strengen.
Tak for dine kommentarer!
Spørg AI
Spørg AI
Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat
Fantastisk!
Completion rate forbedret til 4
Udfordring: Implementer Betinget Rendering i Chatnotifikation
Stryg for at vise menuen
Opgave: Opret chatnotifikation
Udarbejd en mekanisme, der kun viser en notifikation, når en bruger har ulæste beskeder. Vi skal kontrollere, om brugeren har nogen ulæste beskeder. Hvis denne betingelse er opfyldt, vises en notifikation, der angiver antallet af beskeder. Hvis brugeren ikke har nogen beskeder, vises der intet.
Opgaven er:
- Opret to komponenter:
Appsom forældrekomponent ogNotificationsom barnekomponent. - Forældrekomponenten,
App, skal videregive en prop kaldetmessagestil barnekomponenten.messages-proppen er et array, der indeholder beskeder. I barnekomponenten skal du kontrollere længden afmessages-arrayet. - Hvis der er nogen beskeder i arrayet, vis en streng, der siger:
You have <amount> of unread messages.Her skal<amount>erstattes med det faktiske antal ulæste beskeder.
- For at afgøre, om der er beskeder i arrayet, kan vi kontrollere dets
lengthved hjælp af length-egenskaben. Syntaksen er -array.length. - I React bruger vi operatoren
&&til at implementere logikken fra enif-sætning. - For at konstruere strengen korrekt, skal du erstatte pladsholderen
amountmed den faktiske længde af arrayet. - Brug krøllede parenteser
{array.length}for at indsætte arrayets længde i strengen.
Tak for dine kommentarer!