刷新页面时保存 vuex 数据

1. 创建 function

// 刷新页面时恢复 vuex state 数据

export function recoverStoreState(store) {

  // 刷新页面时存储 state

  window.addEventListener('beforeunload', () => {

    localStorage.setItem('storeState', JSON.stringify(store.state));

  });

  // 加载页面时写入 state

  const storeState = localStorage.getItem('storeState');

  if (!storeState) return;

  store.replaceState(JSON.parse(storeState));

  localStorage.removeItem('storeState');

}

 

2. 在 App.vue created 或者 mounted 勾子内调用

mounted() {

    recoverStoreState(this.$store);

},