All Projects → vip30 → vue2-loading

vip30 / vue2-loading

Licence: MIT license
vue-loading presented in Vue2

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects

Projects that are alternatives of or similar to vue2-loading

Vuebar
(🗃️ Archived) Vue 2 directive for custom scrollbar that uses native scroll behavior. Lightweight, performant, customizable and without dependencies. Used successfully in production on https://ggather.com
Stars: ✭ 650 (+4233.33%)
Mutual labels:  directive, vue2
Vue Image Loader
Vue progressive image loader plugin like Medium
Stars: ✭ 47 (+213.33%)
Mutual labels:  loading, vue2
Vue.imagesloaded
Vue.js 2.0 directive to detect images loading
Stars: ✭ 134 (+793.33%)
Mutual labels:  directive, vue2
Draggable Vue Directive
Vue2 directive that handles drag & drop
Stars: ✭ 286 (+1806.67%)
Mutual labels:  directive, vue2
Vue Directive Tooltip
Vue.js tooltip directive. Easy to use, configure and style
Stars: ✭ 158 (+953.33%)
Mutual labels:  directive, vue2
element-ui-demo
A element-ui admin base on vue2
Stars: ✭ 18 (+20%)
Mutual labels:  vue2
ngx-konami
A simple directive to add easter eggs in your Angular application 👾
Stars: ✭ 34 (+126.67%)
Mutual labels:  directive
tdesign-vue-starter
A starter-kit for TDesign Vue UI components.
Stars: ✭ 199 (+1226.67%)
Mutual labels:  vue2
vue-unstated
A tiny state management library for Vue Composition API.
Stars: ✭ 30 (+100%)
Mutual labels:  vue2
image-loader
Image loading library for Android
Stars: ✭ 19 (+26.67%)
Mutual labels:  loading
vue-music
基于Laravel5.3+Vue2.0的网易云音乐的SPA应用
Stars: ✭ 85 (+466.67%)
Mutual labels:  vue2
wdtLoading
Asana like application loading screen
Stars: ✭ 89 (+493.33%)
Mutual labels:  loading
vue-split-carousel
a carousel component for vue, meanwhile display several carousel item
Stars: ✭ 37 (+146.67%)
Mutual labels:  vue2
vue-ckeditor
✏️ Vue2.0 Ckeditor component.
Stars: ✭ 17 (+13.33%)
Mutual labels:  vue2
graphql-directive-computed-property
GraphQL directive for create computed property
Stars: ✭ 32 (+113.33%)
Mutual labels:  directive
v-copy
Vue directive to copy to clipboard. (1kB)
Stars: ✭ 88 (+486.67%)
Mutual labels:  directive
ic-firebase-uploader
This component is a multi-file uploader for firebase
Stars: ✭ 21 (+40%)
Mutual labels:  vue2
cpp-indicators
A very simple, easy-to-use, and single-header-only C++ library for console based indicators (loading spinners)
Stars: ✭ 13 (-13.33%)
Mutual labels:  loading
mobile
Go语言中文网移动端版本,使用 Vue.js(2.x) 构建
Stars: ✭ 35 (+133.33%)
Mutual labels:  vue2
vue-code-view
A Vue 2 component like Vue SFC REPL `@vue/repl` : u can edit, run and preview the code effect display in real time on the web page.
Stars: ✭ 67 (+346.67%)
Mutual labels:  vue2

vue2-loading

npm vue2

vue-loading presented in Vue2

Install

npm i -S vue2-loading

Dependencies

font-awesome for spinner css

Usage

In App.vue
<script>
  import VueLoading from 'vue2-loading'
  Vue.use(VueLoading, {
    text: 'Here I come...',
    bg: 'rgba(230, 233, 236, 0.8)',
    textColor: '#000',
    spinnerClass: 'fa fa-spin fa-spinner fa-3x'
  })
</script>


<template>
  <div v-loading="isLoading (Boolean)"> 
  </div>
</template>

Options

text:

  • loading block text
  • default value: "Loading ..."

bg:

  • loading block backgroundColor css,
  • default value: "rgba(230, 233, 236, 0.8)"

textColor:

  • loading message text css,
  • default value: "#fff"

spinnerClass:

  • loading spinner class,
  • default value: "fa fa-spin fa-spinner fa-3x"

©️ License

MIT

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].