[Vuex] stateを全て破棄する方法

ログアウト処理などでstateをすべて破棄したい。

Vuexに組み込みでdestoryState(),clearState()的なAPIが生えているのを期待していたのだが、無いようなので泥臭く実装を行う。

方法

以下のような実装を行う。

const initialState = {
  token: '',
  isAuthenticated: false
};

export const state = () => Object.assign({}, initialState);

export const mutations = {
  destroySession(state) {
    for (let key in state) {
      if (initialState.hasOwnProperty(key)) {
        state[key] = initialState[key];
      }
    }
  }
};

簡単にいえば、対象のstateをループで削除していく処理である。

  1. stateinitialStateと別で定義
  2. mutationsのdestroySession()内で初期化
    1. stateinitialStateでkeyが一致しているものだけinitialStateで初期化する