Vue-Router 的params和query传参两种方式

谨记：$router 和 $route 不一样

$router ：是路由操作对象，只写对象

$route : 是路由信息对象， 只能读取对象中的信息。

 

<router-link :to="{path:'select',query:{id:3}}">selectPathquery</router-link>
<router-link :to="{name:'select',query:{id:3}}">selectNamequ</router-link>
<router-link :to="{path:'select',params:{id:3}}">selectPathPa</router-link>   // 取不到值
<router-link :to="{name:'select',params:{id:3}}">selectNamePa</router-link>

{
      path: '/select',   
      name: 'select',
      component: select
    },

 

 

path: '/select/:id' 没有设置/:id时

 

 

  <router-link :to="{name:'sel',params:{id:3}}">selectNamePa</router-link>

 

 

{
      path: '/select/:id',    //params 设置在路由了，如果是query引入，不需要添加参数
      name: 'sel',
      component: select
 },

 

没有传这个参数，会导致跳转失败或者页面会没有内容。

　　3.name 中的字段和路由中的name有关系。