2017-05-14 5 views
0
<Route path="/user/:username/" component={UserProfile} /> 

Ich habe eine Route wie oben und mit Ausgabe aufReagieren Reload-Komponente auf dem dynamischen Routen

<Link to={"/user/" + userName + "/"}>user profile</Link> 

einrichten Wenn Benutzer /user/user1/ zu /user/user2/ gehen, weil es nicht die Komponente nicht neu geladen, sondern nur um die Zustände aktualisieren .

Was ist der beste Weg, um dieses Problem zu lösen? Ich brauche HTTP-Anfrage in componentDidMount ausgeführt werden, wenn Benutzername ändert.

+0

Wahrscheinlich benötigen Sie eine andere Lebenszyklusmethode als 'componentDidMount'. 'shouldComponentUpdate' wird aufgerufen, wenn der Status Ihrer Komponente geändert werden soll, wobei das Lesen aus dem letzten Satz das ist, wofür Sie Ihre HTTP-Anfrage ausführen möchten. – thibmaek

Antwort

2

Die geroutete Komponente wird nicht neu geladen, wenn sich die Routenparameter ändern. Aber es wird componentWillReceiveProps() als die Komponente rufen Sie verschiedene Requisiten. Rufen Sie daher die HTTP-Anforderung sowohl in componentWillReceiveProps() als auch in componentDidMount an, da React während der Montage nicht mit den Anfangsstützen componentWillReceiveProps() aufruft.

+0

Vielen Dank für die Antwort! Das scheint zu funktionieren, aber ich habe ein anderes Problem, das mich blockiert, um das zu testen. in 'compoeneWillReceiveProps()' Ich benutze 'this.props.params.username', um die HTTP-Anfrage zu machen, aber es zeigt den vorherigen Wert anstelle des neuen Wertes, den ich eine HTTP-Anfrage machen kann. Irgendeine Idee warum? – Ohsik

+0

componentWillReceiveProps (nextProps) die neuen Requisiten als Argument erhalten, verwenden Sie also 'nextProps.params.username' anstelle von' this.props.params.username' Lesen Sie hier mehr https://facebook.github.io/react/docs/ react-component.html # componentwillreceiveprops –

+0

Vielen Dank genau das, was ich brauchte! – Ohsik

Verwandte Themen