46 lines
1.0 KiB
JavaScript
46 lines
1.0 KiB
JavaScript
/**
|
|
* Loading 组件
|
|
*/
|
|
|
|
import { Component } from './Component.js';
|
|
|
|
export class Loading extends Component {
|
|
/**
|
|
* @param {HTMLElement|string} container - 容器元素或选择器
|
|
* @param {Object} props - 组件属性
|
|
* @param {string} props.text - 加载文本
|
|
*/
|
|
constructor(container, props = {}) {
|
|
super(container, {
|
|
text: '加载中...',
|
|
...props
|
|
});
|
|
}
|
|
|
|
render() {
|
|
const root = this.createElement('div', {
|
|
className: 'cwd-loading',
|
|
children: [
|
|
this.createElement('div', { className: 'cwd-spinner' }),
|
|
this.createTextElement('span', this.props.text, 'cwd-loading-text')
|
|
]
|
|
});
|
|
|
|
this.elements.root = root;
|
|
this.empty(this.container);
|
|
this.container.appendChild(root);
|
|
}
|
|
|
|
/**
|
|
* 更新加载文本
|
|
* @param {string} text - 新文本
|
|
*/
|
|
setText(text) {
|
|
this.props.text = text;
|
|
const textEl = this.elements.root.querySelector('.cwd-loading-text');
|
|
if (textEl) {
|
|
textEl.textContent = text;
|
|
}
|
|
}
|
|
}
|