代码拉取完成,页面将自动刷新
同步操作将从 鹏鹏/avue-doc 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
在需要等待加载内容的位置提供一个占位图。
:::demo
最简单的占位效果。
<avue-skeleton></avue-skeleton>
<br />
最后一行占满的效果
<avue-skeleton block></avue-skeleton>
<br />
带头像的效果
<avue-skeleton avatar></avue-skeleton>
<br />
自定义行数的效果
<avue-skeleton avatar :rows="5"></avue-skeleton>
<br />
自定义列表的效果
<avue-skeleton avatar :rows="4" :number="3"></avue-skeleton>
<br />
动态切换效果
<el-switch :active-value="false" :inactive-value="true" v-model="loading" active-color="#13ce66"
inactive-color="#ff4949">
</el-switch>
<avue-skeleton :loading="loading">
<span>加载的内容</span>
</avue-skeleton>
<script>
export default {
data(){
return {
loading:true,
}
}
}
</script>
:::
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
active | 是否展示动画效果 | Boolean | true/false | true |
avatar | 是否显示头像占位图 | String | true/false | false |
loading | 是否显示骨架屏 | Boolean | true/false | true |
rows | 设置段落的行数 | Number | - | 3 |
block | 最后一行是否占满 | Boolean | true/false | false |
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。