Uppgift: Skapa en bankvarning

Vi arbetar med ett bankkonto. Målet är att utveckla en logik som informerar användaren om denne har tillräckligt med pengar på sitt kort för att täcka ett angivet pris. Beroende på resultatet kommer vi att visa olika meddelanden till användaren.

Uppgiften är:

• Skapa två komponenter – App, förälder, och Message, barn.
• Föräldrakomponenten (App) skickar vidare propsen moneyAvailable, price och name.

1. moneyAvailable – representerar mängden pengar användaren har;
2. price – anger summan pengar användaren behöver betala;
3. name – avser användarens namn.

• Om användaren har tillräckligt med pengar för att betala, visas meddelandet: Success! The remaining amount of money for <user_name> is: <calculated_amount_of_money_left>. Thank you!.
• Om användaren inte har tillräckligt med pengar för att betala, visas meddelandet: Failure! The bank account balance for <user_name> is: <moneyAvailable>. Unfortunately, you need to pay: <price>.

1. I React används den ternära operatorn condition ? ... : ... för att implementera logiken i ett if...else-uttryck.
2. För att konstruera strängen korrekt,
   • Ersätt platshållaren user_name med det faktiska användarnamnet: name-prop;
   • Ersätt platshållaren calculated_amount_of_money_left med det beräknade beloppet som är kvar – moneyAvailable - price;
   • Ersätt platshållaren moneyAvailable med det faktiska tillgängliga beloppet – moneyAvailable-prop;
   • Ersätt platshållaren price med det faktiska priset – price-prop.
3. Använd klamrar {...} för att tilldela ett värde som inte är av strängtyp.