Vuex data persistence

3. The VUEX value disappears when the page is refreshed

3.1 installation vuex – persistedstate

npm install vuex-persistedstate
Copy the code

3.2 Importing index in the Store directory

import createPersistedState from 'vuex-persistedstate'
Copy the code

3.3Configuration vuex – persistedstate

Place the modules that need to be persisted in PERSIST_PATHS

Don’t persist anything that doesn’t need to be persisted.

// Create the PERSIST_PATHS variable to store the module to persist
const PERSIST_PATHS = ['user']
const store = new Vuex.Store({
  state: {},
  modules: {
    app,
    settings,
    user,
    permission,
    tagsView
  },
  getters,
  // Add a rule to save the value of vuex
  plugins: [createPersistedState({
    storage: window.sessionStorage,
    // Use it here
    paths: PERSIST_PATHS
  })]
})
Copy the code