2019-05-15 20:53:04 +08:00

1.2 KiB
Raw Blame History

Skeleton

Install

import { Skeleton } from 'vant';

Vue.use(Skeleton);

Usage

Basic Usage

<van-skeleton title :row="3" />

Show Avatar

<van-skeleton title avatar :row="3" />

Show Children

<van-skeleton
  title
  avatar
  :row="3"
  :loading="loading"
>
  <div>Content</div>
</van-skeleton>
export default {
  data() {
    return {
      loading: true
    }
  },
  mounted() {
    this.loading = false;
  }
};

API

Props

Attribute Description Type Default
row Row count Number 0
row-width Row width, can be array `Number String
title Whether to show title placeholder Boolean false
title-width Title width `Number String`
avatar Whether to show avatar placeholder Boolean false
avatar-size Size of avatar placeholder `Number String`
avatar-shape Shape of avatar placeholdercan be set to square String round
loading Whether to show skeletonpass false to show child component Boolean true
animate Whether to enable animation Boolean true