vue路由傳參query和params的區別(詳解!)


1.query使用path和name傳參跳轉都可以,而params只能使用name傳參跳轉。

query傳參:

  頁面帶參數跳轉: this. $router. push({ path: '/city',name:'City', query: { cityid: this. Cityid, cityname: this. Cityname }})
 
  路由配置:{ path: '/city', name: 'City', component:City},
 
  接收參數: this. cityid = this. $route. query. cityid;

params傳參:

  頁面帶參數跳轉: this. $router. push({ name: 'City', params: { cityid: this. Cityid, cityname: this. Cityname }})
 
  路由配置:{ path: '/city/:cityid/:cityname', name: 'City', component:City},
 
  接收參數: this. cityid = this. $route. params. cityid;

2.傳參跳轉頁面時,query不需要再路由上配參數就能在新的頁面獲取到參數,params也可以不用配,但是params不在路由配參數的話,當用戶刷新當前頁面的時候,參數就會消失。

  也就是說使用params不在路由配參數跳轉,只有第一次進入頁面參數有效,刷新頁面參數就會消失。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM