Nuxt3 - 从中间件访问 Vuex 存储？

Question

如何从中间件中访问 Vuex 存储？

我知道 Nuxt3 建议使用 Pinia，但由于依赖项冲突，我在安装/集成它时遇到了问题，所以我使用了 ol' 好的 Vuex。

问题是，在 Nuxt3 中，我的中间件无法访问

context

对象，而只能访问导航到/来自的路由。

所以问题可能变成：这可能吗？还是我被迫使用 Pinia？

Answer 1

创建一个插件来处理这个问题。它甚至可以在当前的 Nuxt 3.6.5 上运行

这里：

import { useUserStore } from '@/store';

export default defineNuxtPlugin(nuxt => {
    const store = useUserStore(nuxt.$pinia);

    addRouteMiddleware('my-middleware', async (to, from) => {
        // TODO:
    }, { global: true });
});

对于非全局中间件，您只需删除全局标志，因此

  addRouteMiddleware('named-test', () => {
    console.log('this named middleware was added in a plugin')
  })
})