skeletons
首屏渲染-小程序骨架屏动态注入组件
前往github预览
skeletons组件中的默认值表格
| 属性 | 类型 | 默认 | 可选 | 备注 |
|---|---|---|---|---|
| selector | String | 'skeletons' | 建议skeletons写入容器class，默认wx.getSystemInfoSync() | |
| background | String | '#FFF' | ||
| block_animation | String | 'shine' | 'shine' || 'gradient' | |
| loading | String | 'music' | 'music' || 'shine' | |
| is_captrue | Boolean | false | 抓取节点控制 | |
| is_complete | Boolean | false | 渲染关闭控制 |
| 节点类 | 备注 |
|---|---|
| skeletons-rect | 正方形 |
| skeletons-circle | 圆形 |
| skeletons-... | 陆续开放 |
列举案例的使用方法，老司机喵一眼就懂～
!-- index.wxml include skeletons component -- view class="container skeletons" view class="author skeletons-circle" Titan_star /view view class="skeletons-rect" text 首屏渲染-小程序骨架屏动态注入组件 /text /view view class="usermotto" text class="user-motto skeletons-rect"Hello skeletons/text /view /view skeletons is_capture_nodes={{is_capture_nodes}} is_complete="{{is_complete}}" loading="music" block_animation="shine" selector="skeletons" background="#fff" /复制代码 /** index.wxml include skeletons file offset **/ { "usingComponents":{ "skeletons":"/components/skeletons/index" } }复制代码 /** index.js operating props value change **/ wx.request({ url:'/Titan_star', success:()={ this.setData({ is_capture_nodes:true //draw notes },()={ this.setData({ is_complete:true }) }) } })复制代码contact
- 组件的功能还有许多的不足可以优化，也欢迎小伙伴有更好的建议issues提交
- 如果你觉得不错，前往我的github，点个star好评
License
MIT
发送邮箱
Copyright (c) 2018-present, Shiwen (Titan_star) Lai
