So implementieren Sie einen Sprung mit Parametern im Uniapp-Routing

UniApp ist ein plattformübergreifendes Entwicklungsframework, das das einmalige Schreiben von Code und das gleichzeitige Veröffentlichen auf mehreren Plattformen unterstützt. In UniApp müssen wir häufig die Routing-Sprungfunktion verwenden, um zwischen verschiedenen Seiten zu springen. Unter diesen ist das Springen mit Parametern eine relativ häufige Situation. In diesem Artikel wird das UniApp-Routing mit Parametersprung vorgestellt.

1. Routensprung

In UniApp implementieren wir den Routensprung über die Funktion uni.navigateTo(). Mit dieser Funktion können Sie von einer Seite zur anderen springen, beispielsweise von der Startseite zur Detailseite. Das Folgende ist ein einfaches Sprungbeispiel:

// index.vue
uni.navigateTo({
  url: '/pages/detail/detail'
})

Im obigen Beispiel wird der Sprungpfad über den URL-Parameter angegeben. Dieser Pfad ist ein relativer Pfad, der mit „/“ beginnt, was bedeutet, dass zur Detailseite im Seitenverzeichnis gesprungen wird.

2. Mit Parametern springen

Wenn wir Daten zwischen Seiten übertragen müssen, müssen wir „Mit Parametern springen“ verwenden. Wenn Sie beispielsweise von der Listenseite zur Detailseite springen, müssen Sie die ID des aktuell ausgewählten Elements übergeben. In UniApp können Parameter über den Abfrageparameter übergeben werden, wenn die Funktion uni.navigateTo() verwendet wird. Hier ist ein Beispiel für das Springen mit Parametern:

// list.vue
uni.navigateTo({
  url: '/pages/detail/detail?id=' + item.id
})

Im obigen Beispiel werden die Parameter durch Hinzufügen der Abfragezeichenfolge im URL-Parameter übergeben. Die Abfragezeichenfolge beginnt mit „?“, gefolgt vom Parameternamen und Parameterwert und verwendet „&“, um mehrere Parameter zu trennen. „id=1&name=Zhang San“ bedeutet beispielsweise, dass zwei Parameter, ID und Name, übergeben werden und ihre Werte 1 bzw. Zhang San sind.

Beim Empfang von Parametern können wir die übergebenen Parameter über dieses.$route.query-Attribut abrufen. Zum Beispiel:

// detail.vue
console.log(this.$route.query.id) // 输出传递过来的ID参数的值

Im obigen Beispiel wird der Wert des ID-Parameters über this.$route.query.id abgerufen und an die Konsole ausgegeben.

3. Zusammenfassung

Sprung mit Parametern wird in UniApp häufig verwendet und kann zur Übergabe verschiedener Parameter und Daten verwendet werden. Durch die Verwendung von uni.navigateTo() und Abfrageparametern können wir Seitensprünge einfach mit Parametern implementieren. Wenn wir bei der Entwicklung einer UniApp-Anwendung zu einer Seite springen müssen, können wir uns auf das obige Beispiel beziehen und die entsprechende Methode verwenden, um dies zu erreichen.

Das obige ist der detaillierte Inhalt vonSo implementieren Sie einen Sprung mit Parametern im Uniapp-Routing. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!