fln-vue-router-monitor v1.0.7

fln-vue-route-monitor v1.0.7

permite que a aplicação capture os eventos 'back' e 'foward'

Installation

$ npm i --save fln-vue-route-monitor

Usage

// main.js
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import monitor from 'fln-vue-router-monitor'

monitor.use(router)

//set router config
/* export default new Router({
    mode: 'history',
    base: process.env.BASE_URL,
    routes: [...]
/*

new Vue({
    router,
    render: h => h(App)
}).$mount('#app')

<template>
<div id="app">
    <div id="nav">
        <router-link to="/">Home</router-link>|
        <router-link to="/about">About</router-link>
    </div>
    <router-view/>
</div>
</template>

<script>
    import monitor from 'fln-vue-router-monitor'

    export default {
        name: 'app',
        created() {
            // cancel next route change
            // monitor.observeRouteChanged(() => {
            //     console.log('route canceled')
            // })

            // or
            
            // cancel next back event
            monitor.observeBackRoute(()=>{
                console.log('back canceled')
            })
        }
    }
</script>

Api

import monitor from 'fln-vue-router-monitor'

monitor.use(router) // initialize router monitoring
monitor.observeRouteChanged(callback) // cancel next route change and call 'callback' function, if callback is null, cancel observation
monitor.observeBackRoute(callback) // cancel next back event and call 'callback' function
monitor.unobserveBackRoute(callback) // cancel observation of back event
monitor.unobserveBackRouteAll() // cancel all observatior of back event
monitor.on('back|forward', callback) // observer for events back or forward
monitor.off('back|forward', callback) // unobserver for events back or forward
monitor.goHome() // move to initial route
monitor.go(name, next) // move to route bay name