透過 100+ 個技巧學習 Nuxt!

abortNavigation

abortNavigation 是一個輔助函式,可防止導航發生,並在設定為參數時擲回錯誤。
abortNavigation 僅能在路由中介軟體處理常式內使用。

類型

abortNavigation(err?: Error | string): false

參數

err

  • 類型Error | string
    可選的錯誤,將由 abortNavigation 擲回。

範例

以下範例示範如何在路由中介軟體中使用 abortNavigation 來防止未經授權的路由存取

middleware/auth.ts
export default defineNuxtRouteMiddleware((to, from) => {
  const user = useState('user')

  if (!user.value.isAuthorized) {
    return abortNavigation()
  }

  if (to.path !== '/edit-post') {
    return navigateTo('/edit-post')
  }
})

err 作為字串

您可以將錯誤作為字串傳遞

middleware/auth.ts
export default defineNuxtRouteMiddleware((to, from) => {
  const user = useState('user')

  if (!user.value.isAuthorized) {
    return abortNavigation('Insufficient permissions.')
  }
})

err 作為錯誤物件

您可以將錯誤作為 Error 物件傳遞,例如由 catch 區塊捕獲

middleware/auth.ts
export default defineNuxtRouteMiddleware((to, from) => {
  try {
    /* code that might throw an error */
  } catch (err) {
    return abortNavigation(err)
  }
})