Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lernen Herausforderung: Sichtbarkeit Umschalten | React Hooks und Context
React-Meisterschaft
course content

Kursinhalt

React-Meisterschaft

React-Meisterschaft

2. Styling in React Apps
3. React Hooks und Context
4. React in der Realen Welt

book
Herausforderung: Sichtbarkeit Umschalten

Aufgabe

Erstellen Sie eine Komponente, die einen Button und einen Textabsatz enthält. Implementieren Sie die notwendige Logik mit dem useState Hook, um die Sichtbarkeit des Textabsatzes zu toggeln, wenn der Button geklickt wird.

Anweisungen

  1. Importieren Sie den useState Hook aus der React-Bibliothek.
  2. Deklarieren Sie eine Zustandsvariable namens isVisible mit dem useState Hook. Initialisieren Sie sie mit dem Wert false.
  3. Implementieren Sie eine Funktion namens toggleVisibility, die beim Aufruf den isVisible Zustand zwischen true und false wechselt.
  4. Verwenden Sie die toggleVisibility Funktion als onClick Handler für den Button.
  1. Fügen Sie eine import-Anweisung hinzu, um den entsprechenden Hook aus der React-Bibliothek zu importieren.
  2. Für diese Aufgabe verwenden wir den useState-Hook, da wir den Zustand der Absatzsichtbarkeit verwalten.
  3. Um den geeigneten Variablennamen für den Zustand zu bestimmen, beobachten Sie die Funktion, die mit der Zustandssetzung verbunden ist, nämlich setIsVisible. Entfernen Sie das Präfix "set" und verwenden Sie einen Kleinbuchstaben für den ersten Buchstaben des Variablennamens, der isVisible sein sollte.
  4. Um die toggleVisibility-Funktion beim Klicken auf den Button aufzurufen, weisen Sie sie als Wert für das onClick-Attribut des Buttons zu.

War alles klar?

Wie können wir es verbessern?

Danke für Ihr Feedback!

Abschnitt 3. Kapitel 3
We're sorry to hear that something went wrong. What happened?
some-alt