Instant loading Spinner component for Vue.js

vue-instant-loading-spinner

The Instant loading Spinner is a simple yet good looking vue component, which can be quickly integrated.

Below is a simple usage example:

Installation

via yarn

yarn add vue-instant-loading-spinner

Or

via npm

npm install --save vue-instant-loading-spinner

<template>
  <div id="app">
    <vue-instant-loading-spinner ref="Spinner"></vue-instant-loading-spinner>
    <button @click="test()">Run Spinner</button>
  </div>
</template>

Import it from your modules like so:

<script>
import VueInstantLoadingSpinner from 'vue-instant-loading-spinner/src/components/VueInstantLoadingSpinner.vue'

export default {
  name: 'app',
  components: {
    VueInstantLoadingSpinner
  },
  methods: {
    test: function () {
      this.$refs.Spinner.show();
      setTimeout(function () {
        this.$refs.Spinner.hide();
      }.bind(this), 5000);
    }
  }
}
</script>

And you are set, the spinner starts running when you hit the button, until the time expires in the time out method.

For more visit its repository on GitHub.