isNavigationFailure Function | Vue Router

isNavigationFailure is a utility function that checks if a navigation result represents a navigation failure. This is particularly useful when you need to handle navigation errors programmatically.

📋 Signature

function isNavigationFailure(
  error: any, 
  type?: NavigationFailureType
): boolean

🔧 Parameters

• error (any) - The navigation result or error to check
• type (NavigationFailureType, optional) - Specific failure type to check for

🔄 Return Value

• boolean - true if the error is a navigation failure, false otherwise

💡 Usage Examples

Basic Usage

import { isNavigationFailure } from 'vue-router'

router.push('/some-route').catch((error) => {
  if (isNavigationFailure(error)) {
    console.log('Navigation failed:', error)
  } else {
    console.log('Other error occurred:', error)
  }
})

Checking Specific Failure Type

import { isNavigationFailure, NavigationFailureType } from 'vue-router'

router.push('/some-route').catch((error) => {
  if (isNavigationFailure(error, NavigationFailureType.redirected)) {
    console.log('Navigation was redirected')
  }
})

In Navigation Guards

router.beforeEach((to, from, next) => {
  // Some guard logic
  next()
})

router.afterEach((to, from, failure) => {
  if (failure && isNavigationFailure(failure)) {
    // Handle navigation failure
    console.error('Navigation failed:', failure)
  }
})

🎯 Common Use Cases

1. Error Handling - Distinguish navigation failures from other errors
2. Analytics - Track specific types of navigation failures
3. User Feedback - Provide appropriate error messages based on failure type
4. Recovery Logic - Implement fallback navigation strategies

📝 Notes

• This function works with the NavigationFailure interface
• When no type parameter is provided, it checks for any navigation failure
• Navigation failures include aborted, cancelled, and duplicated navigations
• Use with NavigationFailureType enum for precise failure type checking

🔗 Related APIs

• NavigationFailure - Interface for navigation failure objects
• router.afterEach() - Global after hook that receives navigation failures