Vue-router parameters can be classified into two categories

Programmatic navigation router.push and declarative navigation

Programmatic navigation router.push

Programmatic navigation passes parameters of two types: strings and objects.

String: The string mode is to jump directly to the route address as a string. This mode is very simple but does not pass arguments:

this.$router.push("home");
Copy the code

Object: The main way to pass parameters is to write objects, divided into two ways: named routes, query parameters

Passing parameters in named routes will cause an error when the target page is refreshedthis.$router.push({name:"news".params: {userId:123})
      
Copy the code
$route. push({path:"/news',query:{uersId:123}) {this.$route.queryCopy the code

Declarative navigation

string

     <router-link to:"news"></router-link>
     
Copy the code

After routing

    <router-link :to="{ name: 'news', params: { userId: 1111}}">click to news page</router-link>
    
Copy the code

Query parameters

    <router-link :to="{ path: '/news', query: { userId: 1111}}">click to news page</router-link>
Copy the code