vue傳參頁面刷新數據丟失問題

在做vue的時候，經常會遇到組件之間數據的傳遞問題，通過params或者query傳參，但是，當頁面刷新的時候，數據會丟失，找不到數據。今天經過總結，解決了這個問題。通過了一下幾種情況進行傳值：

1.通過params傳參

先在路由path里那個組件需要傳遞參數，定義一個參數，用於組件傳遞，params刷新頁面數據會丟失。

path: "/chatView/:user"  //這裡值用:加參數的寫法，user即為參數，注意一定要用/隔開

在你的組件中，通過點擊傳遞參數，targetUser傳的參數

然後需要用的組件接受，通過beforeRouteEnter進入路由之前執行的函數

1.通過query傳參

路由傳值有兩種方式，params和query，params傳值刷新頁面是要消失的，然而query卻不會，兩者的區別就在於query會把傳遞的參數顯示在url地址中,就像下面這樣

也是在你的組件中，執行什麼方法。觸發什麼事件，把參數傳遞過去

JSON.stringify() 方法是將一個JavaScript值(對象或者數組)轉換為一個 JSON字符串

然後需要用的組件接受，通過beforeRouteEnter進入路由之前執行的函數

這樣無論怎麼刷新，數據都不會丟失。

3.通過vuex取

最好辦的就是通過vuex來存和取你的數據，把你的數據都存在vuex中，然後那個組件需要，直接調用vuex的getters來獲取數據就行。

在你的getters文件中

在組件中如果想取到的話，直接通過計算屬性。

以上是路由傳參和vuex存值、傳值的時候刷新頁面數據消失的解決辦法。喜歡的可以關注一下。