vue.jsvuexvuejs3vuex4

How to clear all Vuex 4 states on logout?


Is there a way to clear all Vuex 4 states?

Code from store.ts:

export const store = createStore<Record<string, any>>({
  strict: process.env.NODE_ENV === 'development',
  plugins: [
    createPersistedState({
      storage: {
        getItem: k => secureLS.get(k),
        setItem: (k, v) => secureLS.set(k, v),
        removeItem: k => secureLS.remove(k),
      },
    }),
  ],
  mutations: {},
  actions: {},
  modules: {
    user,
  },
})

Solution

  • vuex-extensions now supports Vuex 4.

    Creating store:

    import { Store } from 'vuex'
    import { createStore } from 'vuex-extensions'
    
    export default createStore(Store, {...})
    

    Clearing store states:

    // Composition API
    useStore().reset()
    
    // Option API
    this.$store.reset()