骨架框 skeleton 优化中

一个朴实无华的骨架框,可用于加载未完成时展示

使用说明

简单引入

使用skeleton订制骨架

展开代码
<div>
<vi-skeleton style="width: 160px; height: 130px;"/>
<vi-skeleton style="width: 120px; height: 1em; margin-top: .5em;"/>
<vi-skeleton style="width: 80px; height: 1em; margin-top: .5em;"/>
</div>

样式

通过type属性定义不同骨架框样式

展开代码
<vi-skeleton style="width: 50px; height: 50px;"/>
<vi-skeleton style="width: 50px; height: 50px;" type="circle"/>

动画效果

通过animate属性开启动画效果

展开代码
<div>
<vi-skeleton style="width: 160px; height: 130px;" animate/>
<vi-skeleton style="width: 120px; height: 1em; margin-top: .5em;" animate/>
<vi-skeleton style="width: 80px; height: 1em; margin-top: .5em;" animate/>
</div>

Props

属性名描述类型默认值