v-loading-g 加载动画指令

简介

为任意元素添加 Lottie 动画加载效果，常用于局部 loading 场景。动画基于 lottie-web 实现，内置宇航员动画。

基本用法

<template>
  <div v-loading-g="isLoading">内容</div>
</template>

<script setup>
import { ref } from 'vue'
const isLoading = ref(true)
</script>

参数说明

参数	说明	类型	默认值
value	是否显示动画	boolean	false

说明

• 自动为目标元素设置 position: relative。
• 动画会自动撑满目标元素区域。
• 会禁止目标元素滚动，loading 结束后恢复。
• 支持多次触发和销毁。

注意事项

表格中使用加载时, 加载前可以先把内容置为空数组

修饰符

无。