javascript - nuxt vue router afterEach 守卫

Question

如何设置在 nuxt 中路由更改后执行的 afterEach 处理程序？中间件可以用作 beforeEach，但我找不到实现 afterEach Hook 的方法。

Answer 1

您可以像下面这样创建一个插件:

// plugins/after-each.js:
export default async ({ app }) => {

  app.router.afterEach((to, from) => {
    // Do something
  });

}

然后在nuxt.config.js中引用它:

plugins: [ { src: '~/plugins/after-each.js', mode: 'client' } ]

注意:从 Nuxt.js 2.4 开始，mode 被引入作为 plugins 的选项来指定插件类型，可能的值是:client 或 服务器。 ssr: false 将适应 mode: 'client' 并在下一个主要版本中弃用。