📌 Vue Skeletor 要点

用途：提供自适应的骨架屏加载组件，自动匹配现有组件的排版和样式，无需手动绘制方块或圆形。

安装：

复制npm install vue-skeletor -S

使用方式：

• 局部注册：在组件中 import { Skeletor } from 'vue-skeletor' 并注册。

• 全局注册：在 main.js 中 app.component(Skeletor.name, Skeletor)。

插件模式：可通过 app.use(VueSkeletor, { shimmer: false }) 全局配置，关闭闪烁动画。

• 提供 useSkeletor 组合式 API，可在运行时修改全局配置。

属性支持：

• width / height：支持数值或 CSS 字符串。设置 height 时骨架变为矩形。

• size：同时设置宽高，方便生成方形或圆形。

• circle：布尔值，生成圆形骨架。

• pill：布尔值，生成圆角矩形，适合按钮或芯片。

• shimmer：布尔值，控制闪烁动画。

• as：渲染标签类型（默认 span）。

样式定制：

• 使用 BEM 类名覆盖颜色和动画。

• 可通过 CSS 修改背景色、闪烁动画、圆角等。

• 支持主题切换（如暗色模式）。

示例：

• 图片骨架：<Skeletor height="200" />

• 文本骨架：<Skeletor v-for="i in 5" />