Abrufen von Daten in Redux

Question

Ich habe eine Komponente in einer Redux-App, die Daten von einem Remote-Server abrufen muss.

Wo ist der richtige Ort, um den Anruf zu tätigen und alle seine Logik zu behandeln? Aktion Schöpfer? Smart-Komponente in einer Lebenszyklus-Methode wie ComponentDidMount?

Answer 1

Wie in den offiziellen Dokumenten geschrieben: https://facebook.github.io/react/tips/initial-ajax.html

Daten holen in componentDidMount. Wenn die Antwort eintrifft, speichern Sie die Daten im Status und lösen Sie ein Rendering aus, um Ihre Benutzeroberfläche zu aktualisieren.

Answer 2

componentDidMount ist der richtige Ort für einen API-Aufruf. Manchmal möchten Sie es vielleicht in componentWillMount abhängig davon, wie früh Sie die Daten möchten.

Ich würde auch empfehlen, in redux-thunk zu suchen, der beim Erstellen von Aktionen helfen kann, die Daten abrufen.

https://github.com/gaearon/redux-thunk

Answer 3

Es hängt von Ihrer Situation.

Wenn Sie Anwendung mit smart/dumb Komponenten Konzept bauen, der beste Ort, meiner Meinung nach, api Anrufe durchzuführen - ist componentDidMount Lifecycle-Rückruf:

// SomeComponent.js 

// ... other methods ... 

constructor(props) { 
    super(props); 

    this.state = { 
    todos: [], 
    }; 
} 

componentDidMount() { 
    // `axios` is ajax library 
    axios.get('/todos') 
    .then(todos => { 
     this.setState({ 
     todos: todos 
     }); 
    }); 
}