jv3-loader
Version:
easy loading overlay by cdnagroup
76 lines (60 loc) • 1.14 kB
Markdown
# Vue Loading Overlay
A Vue 3 plugin for displaying a full-page loading overlay with a spinner.
## Installation
Install via npm:
```bash
npm install jv3-loader
## Install Plugin to vue
```
```typescript
// main.ts
import JV3Loader from "jv3-loader";
const app = createApp(App);
app.use(JV3Loader);
app.mount("#app");
```
## How to use
```typescript
// Component.vue
<script lang="ts" setup>
...
import { useLoader } from "jv3-loader";
...
...
...
const loader = useLoader();
...
...
...
const task1 = _.debounce(async (date) => {
await loader.add(async () => {
await axios
.post(`...`, {})
.then((res) => {
...
})
.catch((e) => {
alert(e);
});
});
}, 300);
const task1 = _.debounce(async () => {
await loader?.add(async () => {
await axios
.post(`...`, {})
.then((res) => {
...
})
.catch((e) => {
alert(e);
});
});
}, 300);
async function task2(s = 300) {
await new Promise((resolve) => setTimeout(resolve, 500));
}
// call function add task
task1()
loader?.add(() => task2(3000));
loader?.add(() => task2(2000));
```