require vue
2.x
and vue-router2.x
.
vue-navigation default behavior is similar to native mobile app (AãBãC are pages):
!important: vue-navigation adds a key to the url to distinguish the route. The default name of the key is VNK, which can be modified.
DEMO Installingnpm i -S vue-navigation
or
Usage Basic Usageyarn add vue-navigation
main.js
import Vue from 'vue'
import router from './router'Â
import Navigation from 'vue-navigation'
Â
Vue.use(Navigation, {router})
App.vue
Use with vuex2<template>
  <navigation>
    <router-view></router-view>
  </navigation>
</template>
main.js
import Vue from 'vue'
import router from './router'Â
import store from './store'Â
import Navigation from 'vue-navigation'
Â
Vue.use(Navigation, {router, store})
After passing in store
, vue-navigation
will register a module in store
(default module name is navigation
), and commit navigation/FORWARD
or navigation/BACK
or navigation/REFRESH
when the page jumps.
Only router
is required.
EventsVue.use(Navigation, {router, store, moduleName: 'navigation', keyName: 'VNK'})
functions: [ on
| once
| off
]
event types: [ forward
| back
| replace
| refresh
| reset
]
parameter( to
| from
) properties:
name
route
Methodsthis.$navigation.on('forward', (to, from) => {})
this.$navigation.once('back', (to, from) => {})
this.$navigation.on('replace', (to, from) => {})
this.$navigation.off('refresh', (to, from) => {})
this.$navigation.on('reset', () => {})
Use Vue.navigation
in global environment or use this.$navigation
in vue instance.
getRoutes()
get the routing recordscleanRoutes()
clean the routing recordsRetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4