Progress bars is based on nprogress for Vue
Switch branches/tags
Nothing to show
Clone or download
luventa Bump: v0.1.5
compatible with Axios
Latest commit 9b1827f Feb 19, 2017
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
build add new features Oct 20, 2016
dist Bump: v0.1.5 Feb 19, 2017
src Bump: v0.1.5 Feb 19, 2017
.gitignore init Sep 2, 2016
.npmignore add new features Oct 20, 2016
LICENSE update license Nov 30, 2016
README.md deps: add nprogress Nov 30, 2016
package.json Bump: v0.1.5 Feb 19, 2017
yarn.lock Bump v0.1.3 Nov 30, 2016

README.md

nprogress

Slim progress bars is based on nprogress for Ajax'y applications

Installation

$ npm install vue-nprogress --save

Examples

<template>
  <nprogress-container></nprogress-container>
</template>

<script>
import NprogressContainer from 'vue-nprogress/src/NprogressContainer'

export default {
  components: {
    NprogressContainer
  }
}
</script>
import Vue from 'vue'
import NProgress from 'vue-nprogress'
import App from './App.vue'

Vue.use(NProgress)

const nprogress = new NProgress({ parent: '.nprogress-container' })

const app = new Vue({
  nprogress
  ...App
})

// APIs: see https://github.com/rstacruz/nprogress
// app.nprogress
// app.nprogress.start()
// app.nprogress.inc(0.2)
// app.nprogress.done()
// Component:
// this.$nprogress

Configuration

const options = {
  latencyThreshold: 200, // Number of ms before progressbar starts showing, default: 100,
  router: true, // Show progressbar when navigating routes, default: true
  http: false // Show progressbar when doing Vue.http, default: true
};
Vue.use(NProgress, options)

In order to overwrite the configuration for certain requests, use showProgressBar parameter in request/route's meta.

Like this:

Vue.http.get('/url', { showProgressBar: false })
const router = new VueRouter({
  routes: [
    {
      path: '/foo',
      component: Foo,
      meta: {
        showProgressBar: false
      }
    }
  ]
})

Badges


fundon.me  ·  GitHub @fundon  ·  Twitter @_fundon