Vue method of route-parameters

transmission path matching route only with reference to the received query parameters, name can only be used to match the route to receive parameters params

Method a: passing parameters name

routes: [
    {
      path: '/', name: 'Hello', component: Hello } ] 在相应路由里接收 :console.log(this.$route.name) // Hello

Method two: using route name to match, then the received parameters params

基本语法:

<router-link :to="{name:xxx,params:{key:value}}">valueString</router-link> 示例:<router-link :to="{name:'Home',params:{username:'jspang',id:'555'}}"></router-link> 在相应路由里接收 :console.log(this.$route.params) // {username: "jspang", id: "555"}

Method 3: Use the routing path to match, then the query is received by the same method parameters: name parameters to match the transmission route

示例:<router-link :to="{path:'/Home',query:{username:'jspang',id:'555'}}"></router-link> 在相应路由里接收 :console.log(this.$route.query) // {username: "jspang", id: "555"}

Method four: url transfer parameters using the parameters provided in the form of a colon ---- in the configuration file.

示例:{
    path:'/params/:newsId/:newsTitle',
    component:Params } <router-link to="/params/198/jspang website is very good">params</router-link>

Method five: the direct path and then jump back splicing parameters

示例: <router-link to="/GoodsInfo?a=1"></router-link> 在相应路由里接收 :console.log(this.$route.query.a)
 
 
 

Guess you like

Origin www.cnblogs.com/yj-ang3141/p/11652595.html