vuex结合localstorage使用

Vuex结合LocalStorage使用可以实现在浏览器中存储和读取Vuex的状态，以便在页面刷新或关闭后仍能保留状态。

具体实现方法是，在Vuex的store中添加一个插件，该插件在每次mutation被调用时将state存储到LocalStorage中，以便在下次页面加载时读取。

示例代码如下：

import Vuex from 'vuex'

const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment(state) {
      state.count++
    }
  },
  plugins: [
    (store) => {
      store.subscribe((mutation, state) => {
        localStorage.setItem('store', JSON.stringify(state))
      })
    }
  ]
})

// 在页面加载时从LocalStorage中读取state
const savedState = JSON.parse(localStorage.getItem('store'))
if (savedState) {
  store.replaceState(savedState)
}

这样，每次调用mutation时，state都会被自动存储到LocalStorage中，以便在下次页面加载时读取。同时，也可以在需要时手动调用`localStorage.setItem()`和`localStorage.getItem()`来存储和读取状态。