vue路由傳參params和query的用法和區別

2021-09-23 18:33:47 字數 766 閱讀 6624

1.params

//帶過去id

通過this.$router.push(});

由於動態路由也是傳遞params的,所以在 this.$router.push() 方法中 path不能和params一起使用,否則params將無效。需要用name來指定頁面。

及通過路由配置的name屬性訪問

在路由配置檔案中定義引數:

2.query

頁面通過path和query傳遞引數,該例項中row為某行**資料

在目標頁面通過this.$route.query獲取引數:

this.$route.query.row。***

#####區別:

1、用法:

query要用path來引入,params要用name來引入,接收引數都是類似的,分別是this.rou

te.q

uery

.nam

e和th

is

.route.query.name和this.

route.

quer

y.na

me和t

his.

route.params.name。

注意接收引數的時候,已經是rou

te而不

是route而不是

route而

不是router

2、展示上

query更加類似於我們ajax中get傳參,params則類似於post,說的再簡單一點,前者在瀏覽器位址列中顯示引數,後者則不顯示

vue路由傳參 params和query

query傳參 路由 routes 傳參 通過path引入 this router.push 通過name引入 this router.push 接收 com和hhhhome元件中 console.log this route.query params傳參 只能用name引入,不能用path 路由 ...

VUE路由傳參之params傳參和query傳參

下列觀點只代表個人觀點,如有不足之處,煩請指正!今天在頁面間使用 router.push傳參時,發現頁面重新整理資料之後,路由中params的資料丟失了。1.繼續使用params傳參 繼續使用params傳參,需要在對應路由中新增引數,用來儲存 不知道這麼說對不對 params中對應的引數。如圖 模...

vue路由傳參params和query區別

params和query傳參的區別 用params傳參,f5強制重新整理引數會被清空,引數不會顯示到路徑上。路由配置時要在path屬性值得後面加 例如 id 用query,由於引數適用路徑傳參的所以f5強制重新整理也不會被清空,引數會顯示到路徑上。1 配置路徑rutes export default...