Benutzerdetail-App
Stufe 1
Sie werden eine Web-App mit „create-react-app“ und „react-router“ erstellen.
Mithilfe der Benutzerdaten aus der randomUser-API erstellen Sie eine Liste mit 10 Benutzern.
- Der Name jedes Benutzers wird in der Liste angezeigt.
- Wenn Sie auf den Namen eines Benutzers klicken, gelangen Sie zur entsprechenden Benutzerdetailseite, die aus dem Foto, dem Namen, der E-Mail-Adresse, dem Bundesland und dem Land des Benutzers besteht.
Daten zur Anzeige auf der Benutzerdetailseite:
- Foto
- Name
- E-Mail
- Standort (Bundesstaat und Land)
API-URL: https://randomuser.me/api/
Abfrageparameter: Ergebnisse=10
Zusätzlich:
Überlegen Sie, wie Sie den Code optimieren können.
Stufe 2
- Zustandsverwaltung implementieren.
- Rufen Sie die Benutzergruppe nur einmal ab. Kein Netzwerkanruf, wenn wir zwischen Seiten wechseln.
- Fügen Sie auf der Detailseite eine Schaltfläche hinzu, um einen Benutzer als Favorit zu markieren.
- Heben Sie auf der Startseite Lieblingsbenutzer mit speziellem CSS hervor.
Das obige ist der detaillierte Inhalt vonReact Interview Assignment-user-detail-app. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!