Zusammenfassung der Routing-Jump-Methoden in verschiedenen Versionen von React

Dieses Mal werde ich Ihnen eine Zusammenfassung der verschiedenen Versionen von ReactRoute-Sprungmethoden und der Vorsichtsmaßnahmen für verschiedene Versionen von React-Route-Sprung geben. Hier sind tatsächliche Fälle: Lasst uns einmal einen Blick darauf werfen.

Vorwort

React-Router wurde in mehreren Versionen veröffentlicht. Die Methoden zur Verwendung der Routing-Navigation sind alle unterschiedlich. .

React-Router 2.0.0-Version

Die Version 2.0.0 muss browserHistory zum Springen verwenden. Weitere Informationen finden Sie im Code :

import { browserHistory } from 'react-router'
browserHistory.push('/path')

React-Router 2.4.0 oder höher

React-Router 2.4.0 oder höher, Sie können die Mixin-Methode verwenden, um Fügen Sie dies zur Komponente hinzu.routerAttribut, und führen Sie dann die entsprechenden Operationen aus:

import { withRouter } from 'react-router';
clsss ABC extends Component {
}
module.exports = withRouter(ABC);

Komponenten, die mixin verwendet haben, haben das Attribut this.router, und Sie müssen nur this.props.router .push('/path') verwenden, um zur entsprechenden Route zu springen.

React-Router Version 3.0.0 oder höher

Nach Version 3.0.0 ist es nicht mehr erforderlich, die Router-Attribute manuell einzumischen im Zusammenhang mit jedem Bedarf. Schreiben Sie this.props.router.push('/path') in die gesprungene Komponente, um zur entsprechenden Route zu springen.

React-Router 4.0 oder höher

Routing-Sprung

React-Router 4.0 hat das Routing-Attribut verbessert wurde in das Verlaufsattribut geändert, und die Verwendungsmethode ist immer noch ähnlich wie bei 3.0. Verwenden Sie this.props.history.push('/path') , um überall zu springen, wo Sie springen müssen.

Parametererfassung

kann verwendet werden Parameter der aktuellen Route this.props.match.params.xxx

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

AngularJS-Modalbox-Vorlage ngDialog-Anwendungsfallfreigabe

Detaillierte Schritte zur Verwendung von Cookies, um angemeldet zu bleiben

Das obige ist der detaillierte Inhalt vonZusammenfassung der Routing-Jump-Methoden in verschiedenen Versionen von React. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!