So übergeben Sie Parameter im Reaktionsrouter

So übergeben Sie Parameter in React Router: 1. Verwenden Sie Platzhalter, um Parameter zu übergeben. Sie können nur Zeichenfolgen übergeben, und die Parameter gehen beim Aktualisieren der Seite nicht verloren. 2. Verwenden Sie eine Abfrage, um Parameter zu übergeben Durch das Aktualisieren der Seite gehen die Parameter verloren. 3. Verwenden Sie den Status, um Parameter zu übergeben. Sobald die Seite aktualisiert wird, gehen die Parameter verloren.

Die Betriebsumgebung dieses Tutorials: Windows 10-System, Reaktionsversion 17.0.1, Dell G3-Computer.

So übergeben Sie Parameter im React-Router

Es gibt drei Möglichkeiten, Parameter im React-Router-Routing zu übergeben: Parameter über Platzhalter übergeben, Parameter über Abfrage übergeben und Parameter über Status übergeben. 1. Übergabe von Wildcard-Parametern Seite gehen die Parameter nicht verloren.

Nachteile: Es können nur Zeichenfolgen übergeben werden. Wenn zu viele Werte übergeben werden, wird die URL lang und hässlich. Wenn Sie ein Objekt übertragen möchten, können Sie es mit JSON.stringify() in einen String konvertieren und es dann mit JSON.parse() zurückkonvertieren, nachdem Sie es auf einer anderen Seite empfangen haben.

2. Abfrage

Routendefinitionsmethode:

<Route path=&#39;/path/:name&#39; component={Path}/>

Link-Komponente:

<Link to="/path/通过通配符传参">通配符</Link>

<Route path=&#39;/query&#39; component={Query}/>

Parametererfassung:

this.props.location.query

Vorteile: Elegantes, übertragbares Objekt

Nachteile: Aktualisieren Sie die Seite, Parameter gehen verloren

3, Zustand

Routendefinitionsmethode:

var query = {undefined
        pathname: '/query',
        query: '我是通过query传值 '
}

Link-Komponente:

<Link to={query}>query</Link>

Parametererfassung:

this.props.location.state

hier this.props.location.state === „Ich übergebe den Wert per Abfrage“

Vorteile: Elegante, übertragbare ObjekteNachteile: Seite aktualisieren, Parameter gehen verloren

Empfohlenes Lernen: „

Video-Tutorial reagieren

“

Das obige ist der detaillierte Inhalt vonSo übergeben Sie Parameter im Reaktionsrouter. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!