Ga naar hoofdinhoud

Input veld

πŸ“‚ Naam project: lab-state-shared-inputs
πŸ”— Basis project: n/a

Maak een nieuwe React applicatie aan en noem deze lab-state-shared-inputs.

Maak een component InputFields aan met de volgende functionaliteit:

  • Het component heeft 1 state inputValue die een string bevat. Deze begint bij een lege string.
  • Zorg ervoor dat je 5 input velden op je scherm staat die allemaal de waarde van inputValue bevatten.
  • Zorg ervoor dat als je iets typt in 1 van de input velden, de waarde van inputValue verandert en alle input velden de nieuwe waarde bevatten.

Gebruik deze component in de App component om de volgende pagina te maken:

Live voorbeeld​

Voorbeeld laden…

Oplossing downloaden​

Eerst zelf proberen!

Maak de oefening eerst zelf, ook als het moeizaam gaat. Pas daarna download je de oplossing om ze met je eigen code te vergelijken.

Als je meteen de oplossing bekijkt, leer je niets. Het zoeken en vastlopen is net het deel waar je het meeste uit leert.

Ik heb het geprobeerd, download