SoFunction
Updated on 2025-04-05

vue2 router dynamic parameter transmission, examples of multiple parameters

This is used in the project generated using vue-cli

For example, when there is a route jump, you need to have two parameters:

<router-link to='/tr'>Check</router-link>

You can write this way:

 <router-link to='/tr/uid/pid'>Check</router-link>

Then go to process this route:

import Vue from 'vue'
import Router from 'vue-router'
import tr from '@/components/'
import tab from '@/components/'

(Router)

export default new Router({
 routes: [

 {
  path:'/tr/:uid/:pid',
  name: 'tr',
  component:tr
 },
 {
  path:'/tab',
  name: 'tab',
  component:tab
 }
 ]
})

You need to use vue-router in , specifically add a colon after path:'/tr/:uid/:pid', backslash, which means that the parameters of the route are followed.

Then go to the corresponding component to accept this routing parameter:

This key-value object can be accessed through this.$ of the instance.

Let's assign a value to the request route:

<router-link to='/tr/15/122'>Check</router-link>

Print the following Object {uid: "15", pid: "122"}

The above examples of the dynamic parameter transmission of vue2 router are all the contents I share with you. I hope you can give you a reference and I hope you can support me more.