需求說明：
在之前寫的文章中，vue---將登錄成功後後臺返回的參數token,id等保存在store中，供其他組件調用 存在問題：當頁面刷新後，vuex中的數據被初始化，導致vuex的state丟失。那麼如何防止頁面刷新後state丟失呢?
解決方案：
藉助sessionStorage解決上述問題， sessionStorage屬性允許在瀏覽器中存儲 key/value 對的數據。
知識點：
sessionStorage語法如下：
// 保存數據到 sessionStorage
sessionStorage.setItem('key', 'value');
// 從 sessionStorage 獲取數據
let data = sessionStorage.getItem('key');
// 從 sessionStorage 刪除保存的數據
sessionStorage.removeItem('key');
// 從 sessionStorage 刪除所有保存的數據
sessionStorage.clear();
本案例將後臺傳回的token直接保存在sessionStorage中，在axios實例中，當設置headers時，直接從sessionStorage獲取。將後臺傳回的用戶數據通過sessionStorage傳入vuex中。
（1）登錄組件中，當登錄成功後
①把token直接保存在sessionStorage中；
②通過【 this.$store.commit("setUserInfo", res.data.result.user);】，提交mutation。
（2）①在axios實例中，當設置headers時，直接從sessionStorage獲取
在router中【index.js】中加入組件內守衛如下：
// 路徑"/"爲登錄路徑
router.beforeEach((to, from, next) => {
if (to.path == "/") {
sessionStorage.removeItem("token");
}
let token = sessionStorage.getItem("token");
if (!token && to.path != "/") {
next({ path: "/" });
} else {
next();
}
});
②在store中的【index.js】中如下：mutations【setUserInfo】中，通過sessionStorage保存用戶信息，在state【loginUserInfo】中，從sessionStorage獲取用戶信息。
在其他組件中，調用【loginUserInfo】
參考文章：