Skeleton 骨架屏 APP
该方法或组件支持移动端小程序调用
PC
该方法或组件支持桌面端小程序调用

在需要等待加载内容的位置提供一个占位图。

引入方式

数字生活小程序工程中,不需要 import,直接使用组件标签即可。

import SkeletonList from '@21cnfe/vui'  
Vue.component('SkeletonList', skeleton-list)

代码演示

基本用法 最简单的占位效果。
<skeleton-list></skeleton-list>
更复杂的组合。 默认为横向占位符,通常在列表中使用。
<skeleton-list :mode="'list'"></skeleton-list>
纵向占位符 通常在展示页使用。
<skeleton-list :mode="'list'" :direction="'vertical'"></skeleton-list>

API

属性 说明 类型 默认值
mode 骨架屏组合方式,’simple’为基本模式,’list’ 为列表模式 String 'simple'
direction 列表模式下组合占位符的方向,基本模式下不可用 String 'horizontal'
  1. 1. Skeleton 骨架屏 APP 该方法或组件支持移动端小程序调用 PC 该方法或组件支持桌面端小程序调用
    1. 1.1. 引入方式
    2. 1.2. 代码演示
    3. 1.3. API