vuestore刷新数据丢失

在 Vue 中使用 Vuex 存储数据时，数据会被存储在内存中。如果用户刷新页面，数据将会丢失，因为 Vuex 的数据是不会被持久化的。为了解决这个问题，可以将数据存储在 localstorage 或者 sessionstorage 中。

在 Vuex 中，可以使用一个插件来监听 Vuex 的 state 的变化，并将其存储到 localstorage 或者 sessionstorage 中。以下是一个简单的实现示例：

const myPlugin = store => {
  // 当 store 初始化时，从本地缓存中获取状态数据
  const state = JSON.parse(localStorage.getItem('my-store') || '{}')
  store.replaceState(state)

  // 当 store 发生变化时，将最新的状态数据保存到本地缓存中
  store.subscribe((mutation, state) => {
    localStorage.setItem('my-store', JSON.stringify(state))
  })
}

export default new Vuex.Store({
  state: {
    // ...
  },
  mutations: {
    // ...
  },
  plugins: [myPlugin]
})

在上面的代码中，我们定义了一个名为 `myPlugin` 的插件，该插件会在 store 初始化时从本地缓存中获取状态数据并替换 store 的状态，然后在 store 变化时将最新的状态数据保存到本地缓存中。

需要注意的是，localstorage 或者 sessionstorage 中存储的数据有大小限制，且可以被用户手动删除。因此，在使用 localstorage 或者 sessionstorage 存储数据时，需要考虑数据安全性和可靠性，并在必要时使用后端存储方案来保证数据的持久化和同步。