37 lines
1.0 KiB
JavaScript
37 lines
1.0 KiB
JavaScript
/**
|
|
* Loading 加载(规范 §21 推荐列表加载状态)
|
|
*
|
|
* 两种形态:
|
|
* - mode="spinner":圆形旋转(页面级首次加载)
|
|
* - mode="skeleton":骨架屏(列表渐进加载,避免抖动)
|
|
* 用法:
|
|
* <ui-loading mode="spinner" text="正在为你挑选…" />
|
|
* <ui-loading mode="skeleton" rows="3" />
|
|
*/
|
|
Component({
|
|
options: { addGlobalClass: true },
|
|
properties: {
|
|
mode: { type: String, value: 'spinner' }, // spinner|skeleton
|
|
text: { type: String, value: '' },
|
|
rows: { type: Number, value: 3 }, // skeleton 模式行数
|
|
inline: { type: Boolean, value: false }, // 是否行内显示
|
|
},
|
|
data: {
|
|
rowList: [],
|
|
},
|
|
observers: {
|
|
rows(n) {
|
|
const arr = [];
|
|
for (let i = 0; i < n; i++) arr.push(i);
|
|
this.setData({ rowList: arr });
|
|
},
|
|
},
|
|
lifetimes: {
|
|
attached() {
|
|
const arr = [];
|
|
for (let i = 0; i < this.data.rows; i++) arr.push(i);
|
|
this.setData({ rowList: arr });
|
|
},
|
|
},
|
|
});
|