1.0.0 ā€¢ Published 6 years ago

vue-element-loadingwhtest v1.0.0

Weekly downloads
2
License
MIT
Repository
github
Last release
6 years ago

vue-element-loading

ā³ Loading inside a container or full screen for Vue.js

šŸ‘€ Document & Demo Page

Docs & Live demo

šŸ’» Install

npm install --save vue-element-loading

or

yarn add vue-element-loading

šŸ•¹ Usage

import Vue from 'vue'
import VueElementLoading from 'vue-element-loading'

Vue.component('VueElementLoading', VueElementLoading)

or

import VueElementLoading from 'vue-element-loading'

export default {
  components: {
    VueElementLoading
  }
}

šŸ”Ž Example

Inside container

<div>
  <vue-element-loading :active="show" spinner="bar-fade-scale" color="#FF6700"/>
  <span>
    This is my content.
  </span>
</div>

Full screen

<div>
  <vue-element-loading :active="show" is-full-screen/>
</div>

Customize loader

<div>
  <vue-element-loading :active="show">
    <img src="/static/pikachu.gif" width="55px" height="55px">
  </vue-element-loading>
</div>

šŸŒ€ Spinner

See full document here.

āš™ļø Props

PropsTypeDefaultDescription
activeBoolean-Status for show/hide loading
spinnerStringspinnerSpinner icon name: spinner, mini-spinner, ring, line-wave, line-scale, line-down, bar-fade, bar-fade-scale
colorString#cccColor of spinner icon
is-full-screenBooleanfalseLoader will overlay the full page

šŸ¤ Contributing

  1. Fork this repository.
  2. Create new branch with feature name.
  3. Run npm install and npm run dev.
  4. Create your feature.
  5. Commit and set commit message with feature name.
  6. Push your code to your fork repository.
  7. Create pull request. šŸ™‚

ā­ļø Support

If you like this project, You can support me with starring ā­ this repository.

šŸ“„ License

MIT

Developed with ā¤ļø and ā˜•ļø

1.0.0

6 years ago

1.0.1

6 years ago