Browser navigation

How to install?

npm i --save vqua-navigation

Example

const { render } = require('vqua') const Navigation = require('vqua-navigation') const initRoutes = require('./initializers/initRoutes') initRoutes().then(routes => { let liveNodes = [] const navigation = new Navigation(routes) navigation.onNavigate(({ path, statusCode, componentName, params }) => { const $app = document.getElementById('app') const Component = require('./containers/' + componentName) const context = Object.assign(params.context, { navigate: navigation.navigate.bind(navigation) }) const templateNodes = [ Component.v(params.props, context) ] liveNodes = render($app, liveNodes, templateNodes, context) }) navigation.onRedirect(({ redirectPath, statusCode, params }) => { window.history.pushState({}, '', redirectPath) navigation.navigate(redirectPath) }) const $cache = document.getElementById('app-cache') const cache = $cache.innerHTML $cache.parentNode.removeChild($cache) navigation.navigate(window.location.pathname, cache) window.onpopstate = (event) => { navigation.navigate(window.location.pathname) } })

Class Navigation

The main tasks of the class are:

  1. Provide navigation method navigation.navigate('/path/to')
  2. When you call the navigation method, find and execute a route handler.
    And its result is transferred to navigation.onNavigate({ ... })

constructor(routes)

navigation.navigate(path)

navigation.onNavigate({ path, statusCode, componentName, params })

navigation.onRedirect({ path, statusCode, params })