params
無值共有兩種情況會(huì)出現(xiàn):
1 router push params
無值
路由跳轉(zhuǎn)代碼:
this.$router.push({
path: "/cost/order/detail/",
params: row,
});
運(yùn)行的時(shí)候發(fā)現(xiàn)params
為空對(duì)象壶熏,對(duì)象row沒有傳入:
空對(duì)象
后來換成這樣:
this.$router.push({
path: "/cost/order/detail/" + row.id,
params: row,
});
發(fā)現(xiàn)params
值只有一個(gè)id
。很是奇怪咸包,于是查了下官網(wǎng)桃序,找到了答案!
path
原來路由跳轉(zhuǎn)的時(shí)候用
path
烂瘫,params
是會(huì)被忽略的媒熊,需要把path
換成name
奇适。
this.$router.push({
name: "detail",
params: row,
});
修改之后params
確實(shí)傳過去了。但當(dāng)頁面一刷新芦鳍,params
就會(huì)變成空對(duì)象嚷往,就是下面要說的第二種params
無值問題。
2 頁面刷新params
無值
這種情況需要參考第一部分的第二個(gè)代碼示例:將 params
設(shè)置為路由的一部分柠衅。
'detail/:id'
新頁面根據(jù)這個(gè)id
皮仁,重新查詢一遍row
,功能完成。
最后菲宴,了解下query
和params
方式區(qū)別:
-
query
相當(dāng)于get
請求贷祈,頁面跳轉(zhuǎn)可以在地址欄看到參數(shù) -
params
相當(dāng)于post
請求,參數(shù)不會(huì)再地址欄顯示 - 二者可以一起使用,尤其參數(shù)較多時(shí)喝峦。如果參數(shù)相當(dāng)多势誊,可以考慮本地存儲(chǔ)