query 与 params 使用

Posted 2022-11-22 j190512

这个是路由：　

    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‘,query:city:cityName"  >

　　接受数据：

　　　　this.$route.params.city

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

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