zLoading
Vue 2.x component for loading indicator, youtubeBar | google Circle. (support mobile)
Gif display
Install
npm install z-loading -SQuick Start
import Vue from 'vue'; import zloading from 'z-loading'; import 'z-loading/dist/z-loading.css'; Vue.use(zloading); For more information, please refer to Quick Start 快速开始 in documentation.
Browser Support
Modern browsers and Internet Explorer 10+.
Usage
As vue component
<template> <button @click="clickHandle1">Start</button> </template> <script> export default { methods: { clickHandle1 () { this.$zLoading.open(); setTimeout(() => { this.$zLoading.close(); }, 3000); } } }; </script> <template> <div v-zLoading="isLoading"> <button @click="isLoading = true">Start</button> </div> </template> <script> export default { data () { return { isLoading: false }; } }; </script> As not a vue component instance
let timeout = 3000; window.ZLoading.open().close(timeout);
