A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://www.npmjs.com/package/vue-navigation below:

vue-navigation - npm

vue-navigation

require vue 2.x and vue-router 2.x.

中文文档

vue-navigation default behavior is similar to native mobile app (A、B、C are pages):

  1. A forward to B, then forward to C;
  2. C back to B, B will recover from cache;
  3. B forward to C again, C will rebuild, not recover from cache;
  4. C forward to A, A will build, now the route contains two A instance.

!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

DEMO

CODE

Installing

npm i -S vue-navigation

or

yarn add vue-navigation

Usage Basic Usage

main.js

import Vue from 'vue'

import router from './router' 

import Navigation from 'vue-navigation'

 

Vue.use(Navigation, {router})

App.vue

<template>

  <navigation>

    <router-view></router-view>

  </navigation>

</template>

Use with vuex2

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.

Options

Only router is required.

Vue.use(Navigation, {router, store, moduleName: 'navigation', keyName: 'VNK'})

Events

functions: [ on | once | off ]

event types: [ forward | back | replace | refresh | reset ]

parameter( to | from ) properties:

this.$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', () => {})

Methods

Use Vue.navigation in global environment or use this.$navigation in vue instance.


RetroSearch 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