Vue implements page jump method and parameter transfer method

Routing configuration

//Routing Configuration Page
import Vue from 'vue'
import Router from 'vue-router'
import UserManager from '@/components/UserManager'

(Router)

export default new Router({
  routes: [
    {
      path: '/userManager',
      name: 'userManager',
      component: UserManager
    }
  ]
})

1. Tag jump

<router-link to="/userManager"> <router-link/>

Pass parameters when jumping

//Routing configuration path: '/userManager/:id',  
 
 //Jump the page parameters required to be passed&lt;router-link :to="'/userManager/' + "&gt; &lt;router-link/&gt;


//Receive parametersthis.$

2. Event jump

methods: {
  goUserManager() {
    this.$({ path:'/userManager'})
  }
}

query pass

Equivalent to get request, the parameters will be displayed in the address bar when the page jumps.

//Jump pagethis.$({ 
    path:'/userManager',
    query: {
        id:
    }
})

//Receive parametersthis.$

params transfer

Equivalent to post request, the parameters will not be displayed in the address bar when the page is redirected.

//Jump pagethis.$({ 
    path:'/userManager',
    name:'userManager', 
    //Params parameter transfer requires name or it will not be retrieved; the corresponding route configuration name    params: {
        id:
    }
})

//Receive parametersthis.$

When using params to pass parameters, refresh page parameters disappear

Configure routing on path/:idCorresponding to parameter names to be passed

//Routing configuration path: '/userManager/:id',

Notice:

Transfer ginseng isrouter
The receiving parameters areroute

Summarize

The above is personal experience. I hope you can give you a reference and I hope you can support me more.