router5
  • Read Me
  • Introduction
    • Why router5?
    • Getting Started
    • Ecosystem
    • Core concepts
    • Transition phase
  • Guides
    • Defining routes
    • Path Syntax
    • Router options
    • Navigating
    • In the browser
    • Observing state
  • Integration
    • With React
    • With Redux
  • Advanced
    • Plugins
    • Middleware
    • Preventing navigation
    • Errors and redirections
    • Dependency injection
    • Loading async data
    • Universal routing
    • Listeners plugin
  • API Reference
  • Migration
    • Migrating from 7.x to 8.x
    • Migrating from 6.x to 7.x
    • Migrating from 5.x to 6.x
    • Migrating from 4.x to 5.x
    • Migrating from 3.x to 4.x
    • Migrating from 2.x to 3.x
    • Migrating from 1.x to 2.x
    • Migrating from 0.x to 1.x
Powered by GitBook
On this page
  • Plugin requirements
  • Registering a plugin
  • Plugin examples
  1. Advanced

Plugins

router5 is extensible with the use of plugins. Plugins can decorate a route instance and do things on specific router and transition events.

Plugin requirements

A plugin is a function taking a router instance and returning an object with a name and at least one of the following methods:

  • onStart(): invoked when router.start() is called

  • onStop(): invoked when router.stop() is called

  • onTransitionStart(toState, fromState)

  • onTransitionCancel(toState, fromState)

  • onTransitionError(toState, fromState, err)

  • onTransitionSuccess(toState, fromState, opts) (options contains replace and reload boolean flags)

  • teardown(): a function called when removing the plugin

Registering a plugin

function myPlugin(router, dependencies) {
    return {
        onTransitionSuccess: (toState, fromState) => {
            console.log(
                'Yippee, navigation to ' + toState.name + ' was successful!'
            )
        }
    }
}

const router = createRouter()

router.usePlugin(myPlugin)

Plugin examples

Router5 includes a logging plugin that you can use to help development

import createRouter, { loggerPlugin } from 'router5'

const router = createRouter()

const teardownPlgin = router.usePlugin(loggerPlugin)
PreviousAdvancedNextMiddleware

Last updated 6 years ago

Browser plugin
Persistent params plugin
Logger