| 提交 | 用户 | age | ||
| 5db3ce | 1 | import { createLoading } from '/@/components/Loading'; |
| V | 2 | import type { Directive, App } from 'vue'; |
| 3 | ||
| 4 | const loadingDirective: Directive = { | |
| 5 | mounted(el, binding) { | |
| 6 | const tip = el.getAttribute('loading-tip'); | |
| 7 | const background = el.getAttribute('loading-background'); | |
| 8 | const size = el.getAttribute('loading-size'); | |
| 9 | const fullscreen = !!binding.modifiers.fullscreen; | |
| 10 | const instance = createLoading( | |
| 11 | { | |
| 12 | tip, | |
| 13 | background, | |
| 14 | size: size || 'large', | |
| 15 | loading: !!binding.value, | |
| 16 | absolute: !fullscreen, | |
| 17 | }, | |
| 56a966 | 18 | fullscreen ? document.body : el, |
| 5db3ce | 19 | ); |
| V | 20 | el.instance = instance; |
| 21 | }, | |
| 22 | updated(el, binding) { | |
| 23 | const instance = el.instance; | |
| 24 | if (!instance) return; | |
| 25 | instance.setTip(el.getAttribute('loading-tip')); | |
| 26 | if (binding.oldValue !== binding.value) { | |
| 27 | if (binding.oldValue !== binding.value) { | |
| 28 | instance.setLoading?.(binding.value && !instance.loading); | |
| 29 | } | |
| 30 | } | |
| 31 | }, | |
| 32 | unmounted(el) { | |
| 33 | el?.instance?.close(); | |
| 34 | }, | |
| 35 | }; | |
| 36 | ||
| 37 | export function setupLoadingDirective(app: App) { | |
| 38 | app.directive('loading', loadingDirective); | |
| 39 | } | |
| 40 | ||
| 41 | export default loadingDirective; | |
