Utfordring: Veksle Synlighet med useState
Oppgave
Lag en komponent som inkluderer en knapp og et tekstavsnitt. Implementer nødvendig logikk ved å bruke useState-hooken for å veksle synligheten til tekstavsnittet når knappen trykkes.
Instruksjoner
- Importer
useState-hooken fra React-biblioteket. - Deklarer en tilstandsvariabel kalt
isVisibleved å brukeuseState-hooken. Initialiser den med verdienfalse. - Implementer en funksjon kalt
toggleVisibilitysom, når den kalles, veksler tilstandenisVisiblemellomtrueogfalse. - Bruk funksjonen
toggleVisibilitysomonClick-håndterer for knappen.
- Inkluder en
import-setning for å importere riktig hook fra React-biblioteket. - For denne oppgaven skal vi benytte
useState-hooken siden vi håndterer tilstanden for synlighet av avsnittet. - For å bestemme riktig variabelnavn for tilstanden, observer funksjonen som er knyttet til å sette tilstanden, som er
setIsVisible. Fjern prefikset "set" og bruk liten forbokstav for variabelnavnet, som skal væreisVisible. - For å påkalle funksjonen
toggleVisibilitynår knappen trykkes, tildel den som verdi tilonClick-attributtet på knappen.
Alt var klart?
Takk for tilbakemeldingene dine!
Seksjon 3. Kapittel 3
Spør AI
Spør AI
Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår
Suggested prompts:
Can you explain how the useState hook works in this example?
What does the toggleVisibility function do?
How does the button control the visibility of the paragraph?
Awesome!
Completion rate improved to 2.17
Utfordring: Veksle Synlighet med useState
Sveip for å vise menyen
Oppgave
Lag en komponent som inkluderer en knapp og et tekstavsnitt. Implementer nødvendig logikk ved å bruke useState-hooken for å veksle synligheten til tekstavsnittet når knappen trykkes.
Instruksjoner
- Importer
useState-hooken fra React-biblioteket. - Deklarer en tilstandsvariabel kalt
isVisibleved å brukeuseState-hooken. Initialiser den med verdienfalse. - Implementer en funksjon kalt
toggleVisibilitysom, når den kalles, veksler tilstandenisVisiblemellomtrueogfalse. - Bruk funksjonen
toggleVisibilitysomonClick-håndterer for knappen.
- Inkluder en
import-setning for å importere riktig hook fra React-biblioteket. - For denne oppgaven skal vi benytte
useState-hooken siden vi håndterer tilstanden for synlighet av avsnittet. - For å bestemme riktig variabelnavn for tilstanden, observer funksjonen som er knyttet til å sette tilstanden, som er
setIsVisible. Fjern prefikset "set" og bruk liten forbokstav for variabelnavnet, som skal væreisVisible. - For å påkalle funksjonen
toggleVisibilitynår knappen trykkes, tildel den som verdi tilonClick-attributtet på knappen.
Alt var klart?
Takk for tilbakemeldingene dine!
Seksjon 3. Kapittel 3