query 与 params 使用

这个是路由：　

{

    path:'/city/:city',

    name:'City',

    component:City

  }

 

下面使用query和params分别传参

query:

　　<router-link  :to="{name:'City',query:{city:cityName}}"  >

　　能使用可是，浏览器发出警告[vue-router] missing param for named route "City": Expected "city" to be defined

　　　　意思;[Vue router]缺少命名路由“city”的参数：应定义“city”

　　原因：query访问最好使用 路径访问 即 <router-link  :to="{path:'/city/:city',query:{city:cityName}}"  >

　　接受数据：

　　　　this.$route.query.city

　　浏览器路径表现：/city/:city?city=广州

params:

　　<router-link  :to="{path:'/city/:city',params:{city:cityName}}"  >

　　　此时，浏览器没有报错或警告，可是参数却没有传过来  浏览器表现 /city/:city

　　所以要使用name代替路径 <router-link :to="{name:'City',params:{city:cityName}}"  >

　　接受数据：

　　　　this.$route.params.city

　　浏览器路径表现：/city/广州

总结：query 使用路径引入路由  params 使用name来引入路由