Ich benutze react, alt.js und react-Router, und eine Anwendung mit grundlegenden CRUD erstellen. Es gibt einen Menüeintrag für "Create Item", und es zeigt ein modal (mit react-bootstrap ...) an und bei submit wird eine Aktion ausgelöst, um ein Modell im Backend zu erstellen. Dann wird ein browserHistory.push (wie in react-router docs), wenn dies abgeschlossen ist, gehen Sie auf die Artikelseite für das neu erstellte Objekt.reagieren, react-router und asynchrone Daten laden
Also im Grundfall funktioniert das. Zum Beispiel, wenn ich auf der Haupt-App-Seite bin, funktioniert es. Allerdings, wenn ich bereits auf der Artikeldetailseite für einen anderen Artikel war (sagen wir, ich war auf /item/1 und ich habe gerade /item/2 erstellt, so versuche ich, um von Seite /item/1 umleiten).
Und meine Asynchron-Ladelogik (na ja, die Aktion Anruf zumindest für fetchItem) ist in componentDidMount der ItemViewPage Komponente reagieren, die basierend auf allen Beispielen ziemlich typisch scheint, dass ich online finden kann.
Und das Problem ist, wenn die Seite wurde bereits gerendert, componentDidMount wird nie aufgerufen, weil die Komponente bereits montiert ist (!). Und so aktualisiert sich meine Seiten-URL auf , aber der Inhalt ist immer noch für /item/1.
Also, meine Frage ist .... Ja. Kann ich die Datenladung von componentDidMount falsch starten? Soll ich eine andere Lifecycle-Methode verwenden (zB componentWillReceiveProps, da der reaktive Router eine neue ID setzt)? Oder gibt es einen anderen Ort, an dem ich die Daten laden sollte (z. B. reagiert der Router auf einige Funktionen, von denen ich nicht weiß, dass dies der Fall ist)?
['ShuldComponentUpdate'] (https://facebook.github.io/react/docs/component-specs.html#updating-shouldcomponentupdate) ist meine Vermutung, aber es ist wahrscheinlich am besten, wenn Sie etwas Code posten. –
wäre es wahrscheinlich viel Code! Aber wenn ich nur die Frage eintippen wollte, habe ich 'componentWillReceiveProps' gewählt und teste es dort für' if (this.props.params.id! == newProps.params.id) {this.props.fetchItem (newProps.params. Ich würde); } ', das scheint zu funktionieren. Es macht Sinn, denke ich, aber es hat mich überrascht, dass es nicht aus der Box funktioniert. – Kevin
Wie würde es "out of the box" funktionieren, ohne Ihre "params" zu kennen? Wie auch immer, froh, dass es funktioniert hat. Vielleicht das nächste Mal, mehr Forschung vor dem Posten einer Frage;) –