在使用Vue Class Component的NuxtJs项目中如何注册额外钩子？

解决方案 #

你可以按照以下步骤配置即可生效：

1. 先把你创建的class-component-hooks.js文件移动到Nuxt项目根目录的plugins文件夹下，没有该文件夹可手动新建。
2. 打开项目根目录的nuxt.config.js文件，找到plugins配置项，添加该文件的注册：

// nuxt.config.js 示例配置
export default {
  // 其余原有配置保持不变
  plugins: [
    '~/plugins/class-component-hooks.js'
  ]
}

3. 配置完成后重启Nuxt开发服务，beforeRouteEnter等路由钩子即可正常触发。

如果你不想走插件配置，也可以直接将import './class-component-hooks'语句添加到nuxt.config.js文件的最顶部，效果一致。

内容的提问来源于stack exchange，提问作者Arthur Borba