路由中间件是存储在 Nuxt 应用程序的 middleware/ 目录中的导航守卫(除非 另行设置)。
Usage
js
addRouteMiddleware (name: string | RouteMiddleware, middleware?: RouteMiddleware, options: AddRouteMiddlewareOptions = {})
addRouteMiddleware() 采用三个参数：
- name
type: string | RouteMiddlewarename可以是字符串或类型为RouteMiddleware的函数。Function以下一个路由to作为第一个参数，当前路由from作为第二个参数，这两个都是 Vue 路由对象。
详细了解 路由对象 的可用属性。 - middleware
type: RouteMiddleware第二个参数是RouteMiddleware类型的函数。 同上，它提供了to和from路由对象。
如果 addRouteMiddleware() 中的第一个参数已经作为函数传递，则它变为可选。 - options
type: AddRouteMiddlewareOptions可选的options参数允许您将global的值设置为true以指示路由器中间件是否是全局的(默认设置为false)。
示例
匿名路由中间件
匿名路由中间件没有名字。 它以一个函数作为第一个参数，使第二个middleware参数变得多余：
plugins/my-plugin.ts
ts
export default defineNuxtPlugin(() => {
addRouteMiddleware((to, from) => {
if (to.path === '/forbidden')
return false
})
})
命名路由中间件
命名路由中间件将一个字符串作为第一个参数，将一个函数作为第二个参数。
当在插件中定义时，它会覆盖位于 middleware/ 目录中的任何现有同名中间件：
plugins/my-plugin.ts
ts
export default defineNuxtPlugin(() => {
addRouteMiddleware('named-middleware', () => {
console.log('named middleware added in Nuxt plugin')
})
})
全局路由中间件
设置可选的第三个参数 { global: true } 来指示路由中间件是否是全局的：
plugins/my-plugin.ts
ts
export default defineNuxtPlugin(() => {
addRouteMiddleware('global-middleware', (to, from) => {
console.log('global middleware that runs on every route change')
}, { global: true })
})