element-ui skeleton 组件源码分享

今日简单分享 skeleton 骨架屏组件源码,主要从以下四个方面来讲解:

1、skeleton 组件的页面结构

2、skeleton 组件的属性

3、skeleton item 组件的属性

4、skeleton 组件的 slot

一、skeleton 组件的页面结构

二、skeleton 组件的属性

2.1 animated 属性,是否使用动画,类型 boolean,true / false,默认 false。

2.2 count 属性,渲染多少个 template, 建议使用尽可能小的数字,类型 number,integer,默认 true。

2.3 loading 属性,是否显示 skeleton 骨架屏,类型 boolean,true / false,默认 true。

2.4 rows 属性,骨架屏段落数量,类型 number,正整数,默认 0。

2.5 throttle 属性,延迟占位 DOM 渲染的时间, 单位是毫秒,类型 number,正整数,默认 0。

三、skeleton item 组件的属性

3.1 variant 属性,当前显示的占位元素的样式,类型枚举,p / h1 / h3 / text / caption / button / image / circle / rect,默认 text。

四、skeleton 组件的 slot

4.1 default,用于展示真实的 UI。

yH5BAAAAAAALAAAAAAOAA4AAAIMhI+py+0Po5y02qsKADs=wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

4.2 template,用来展示自定义占位符。

相关推荐

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-05-15 23:48:10       98 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-05-15 23:48:10       106 阅读
  3. 在Django里面运行非项目文件

    2024-05-15 23:48:10       87 阅读
  4. Python语言-面向对象

    2024-05-15 23:48:10       96 阅读

热门阅读

  1. Go 处理错误&异常

    2024-05-15 23:48:10       38 阅读
  2. LeetCode算法题:两数之和

    2024-05-15 23:48:10       44 阅读
  3. Unity学习笔记---软件介绍

    2024-05-15 23:48:10       32 阅读
  4. nginx 详解

    2024-05-15 23:48:10       34 阅读
  5. 二刷算法训练营Day08 | 字符串(1/2)

    2024-05-15 23:48:10       35 阅读
  6. MATLAB数组

    2024-05-15 23:48:10       30 阅读
  7. ACAT2021纳新题(C语言)(旧)

    2024-05-15 23:48:10       35 阅读