So verwenden Sie Router-Routing, um Sprungparameter in vue3 zu implementieren

1. Routensprung

1. Führen Sie zuerst die API ein – useRouter

import { useRouter } from 'vue-router'

//先在setup中定义
 const router = useRouter()

4. Wenn es Parameter gibt, führen Sie die API auf der empfangenden Seite ein – useRoute

// 字符串
router.push('home')
// 对象
router.push({ path: 'home' })
// 命名的路由
router.push({ name: 'user', params: { userId: '123' }})
// 带查询参数，变成 /register?userId=123
router.push({ path: 'register', query: { userId: '123' }})

5. Definieren Sie die Variablenroute auf der empfangenden Seite und rufen Sie die übergebenen Variablen ab

import { useRoute } from 'vue-router'

2

1. Wenn der Pfad angegeben wird, werden die Parameter ignoriert, dies ist jedoch bei der Abfrage nicht der Fall. Zu diesem Zeitpunkt müssen Sie den vollständigen Pfad mit Parametern angeben

//首先在setup中定义
const route = useRoute()
//query
let userId=route.query.userId;
//params
let userId=route.params.userId;

2 Gilt auch für das to-Attribut der Router-Link-Komponente

3. Wenn das Ziel und die aktuelle Route identisch sind, haben sich nur die Parameter geändert (z. B. von einem Benutzerprofil zu einem anderen /users/1 -> /users/ 2) müssen Sie beforeRouteUpdate verwenden, um auf diese Änderung zu reagieren (z. B. das Abrufen von Benutzerinformationen)

Das obige ist der detaillierte Inhalt vonSo verwenden Sie Router-Routing, um Sprungparameter in vue3 zu implementieren. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!