Setze Anfangszustand mit mehreren Async-Aufrufen in Redux

Question

Ich entwickle eine App mit React und Redux und ich am Ende mit einem Design Zweifel. Der Punkt ist, wenn ich die App starte, muss ich den Laden mit mehreren API-Anfrage füllen (ich benutze Fetch und Redux-Thunk), die einige Konstanten zurückgibt. Diese Konstanten werden von mehreren Komponenten verwendet, und ich kann sie nicht an eine bestimmte Komponente anhängen, da der Benutzer sie möglicherweise nicht lädt und direkt zu der anderen Komponente geht, die die Daten nicht abruft .... so ... Was ist der beste Weg, damit umzugehen? Wie bevölkert man am besten "initialState" in Redux? Ist auch möglich mit Fetch API Handle mehrere Anfrage wie wir mit $ q alle zum Beispiel tun?

Answer 1

In Ihrer Root-Komponente können Sie die API-Aufrufe in componentDidMount Lifecycle-Methode machen, den Status mit den zurückgegebenen Werten auffüllen. Der Status wird für alle Komponenten der App freigegeben.

Wenn die Komponente, die Sie wollen den Anruf tätigen eine stateless funktionale Komponente ist (und daher nicht die Lebenszyklus-Methoden hat) können Sie wickeln Sie es wie hier gezeigt:

https://egghead.io/lessons/javascript-redux-fetching-data-on-route-change

(Der Rest Dieser Kurs behandelt Async-Anrufe und verwendet Thunks - ein Muss!)