vue.js - 在从本地存储还原 Vuex Store 之前执行的中间件

Question

在 nuxtjs 项目中，我创建了一个 auth 中间件来保护页面。
并使用 vuex-persistedstate(也尝试过 vuex-persist 和 nuxt-vuex-persist)来持久化 vuex 存储。

在页面之间导航时一切正常，但是当我刷新页面或直接登陆 protected 路由时，它会将我重定向到登录页面。

本地存储插件

import createPersistedState from 'vuex-persistedstate'

export default ({ store }) => {
  createPersistedState({
      key: 'store-key'
  })(store)
}

认证中间件

export default function ({ req, store, redirect, route }) {
    const userIsLoggedIn = !!store.state.auth.user
    if (!userIsLoggedIn) {
        return redirect(`/auth/login?redirect=${route.fullPath}`)
    }
    return Promise.resolve()
}

Answer 1

我通过使用这个插件解决了这个问题 vuex-persistedstate而不是 vuex-persist 插件。 vuex-persist 中似乎有一些错误(或者可能是设计架构)导致了它。