vue 頁面間使用路由傳參數,刷新頁面后獲取不到參數的問題

情況

情況再簡單說明一下: 有三個頁面(a-列表頁面,b-內頁1,c-內頁2),頁面a->頁面b->頁面c有參數傳遞.從a進入b后,刷新b頁面拿不到a頁面傳進來的參數.或者b頁面再進入c頁面,並由c頁面返回b頁面,b頁面丟失a頁面傳入的參數.
參數的傳遞使用的是vue-router, query傳參

let para = {
			id: info.subjId,
			subjInit: info.subjInit,
      subjectGuid: info.subjectGuid,
      visitNo: info.visitNo
		}
		this.$router.push({path:'/sign_in_already_detail',query:{para:  para }})

首先說明一下,使用路由的query傳參是可以在刷新的時候保留參數的

之所以出現上面的問題是因為:在query傳參數的時候沒有對對象參數序列化--就是沒有轉成字符串.

所以b頁面(接收參數的頁面)的路由展示是下圖這樣. 只有在第一次進入b頁面的時候能夠拿到參數,之后就獲取不到了

解決辦法也就很明了了,在傳參數的時候對象參數需要序列化處理

let para = {
			id: info.subjId,
			subjInit: info.subjInit,
      subjectGuid: info.subjectGuid,
      visitNo: info.visitNo
		}
		this.$router.push({path:'/sign_in_already_detail',query:{para: JSON.stringify( para) }})

這樣進入b頁面的路由就是如下圖這樣的,即使在刷新頁面后地址也是不會變的.

不過使用路由傳參對於參數的格式以及字符長度我還不是很清楚,猜測字符長度和一般網頁get請求中url的長度差不多.所以參數字符過長還是不適合使用路由傳參

其他頁面間傳參方法

1. bus 傳參
   2.vue-router的params傳參數
   3.利用瀏覽器的sessionStorage,localStorage,Cookie傳參