feat: spin tip support slot
parent
2bd5fc15ff
commit
93a06a45f5
|
@ -15,7 +15,7 @@ export const spinProps = () => ({
|
|||
spinning: PropTypes.looseBool,
|
||||
size: SpinSize,
|
||||
wrapperClassName: PropTypes.string,
|
||||
tip: PropTypes.string,
|
||||
tip: PropTypes.any,
|
||||
delay: PropTypes.number,
|
||||
indicator: PropTypes.any,
|
||||
});
|
||||
|
@ -121,7 +121,12 @@ export default defineComponent({
|
|||
},
|
||||
},
|
||||
render() {
|
||||
const { size, prefixCls: customizePrefixCls, tip, wrapperClassName } = this.$props;
|
||||
const {
|
||||
size,
|
||||
prefixCls: customizePrefixCls,
|
||||
tip = this.$slots.tip?.(),
|
||||
wrapperClassName,
|
||||
} = this.$props;
|
||||
const { class: cls, style, ...divProps } = this.$attrs;
|
||||
const { getPrefixCls, direction } = this.configProvider;
|
||||
const prefixCls = getPrefixCls('spin', customizePrefixCls);
|
||||
|
|
|
@ -13,14 +13,14 @@ When part of the page is waiting for asynchronous data or during a rendering pro
|
|||
|
||||
## API
|
||||
|
||||
| Property | Description | Type | Default Value |
|
||||
| --- | --- | --- | --- |
|
||||
| delay | specifies a delay in milliseconds for loading state (prevent flush) | number (milliseconds) | - |
|
||||
| indicator | vue node of the spinning indicator | vNode \|slot | - |
|
||||
| size | size of Spin, options: `small`, `default` and `large` | string | `default` |
|
||||
| spinning | whether Spin is spinning | boolean | true |
|
||||
| tip | customize description content when Spin has children | string | - |
|
||||
| wrapperClassName | className of wrapper when Spin has children | string | - |
|
||||
| Property | Description | Type | Default Value | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| delay | specifies a delay in milliseconds for loading state (prevent flush) | number (milliseconds) | - | |
|
||||
| indicator | vue node of the spinning indicator | vNode \|slot | - | |
|
||||
| size | size of Spin, options: `small`, `default` and `large` | string | `default` | |
|
||||
| spinning | whether Spin is spinning | boolean | true | |
|
||||
| tip | customize description content when Spin has children | string \| slot | - | slot 3.0 |
|
||||
| wrapperClassName | className of wrapper when Spin has children | string | - | |
|
||||
|
||||
### Static Method
|
||||
|
||||
|
|
|
@ -14,14 +14,14 @@ cover: https://gw.alipayobjects.com/zos/alicdn/8emPa3fjl/Alert.svg
|
|||
|
||||
## API
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ---------------- | -------------------------------------------- | ------------- | --------- |
|
||||
| delay | 延迟显示加载效果的时间(防止闪烁) | number (毫秒) | - |
|
||||
| indicator | 加载指示符 | vNode \| slot | - |
|
||||
| size | 组件大小,可选值为 `small` `default` `large` | string | `default` |
|
||||
| spinning | 是否为加载中状态 | boolean | true |
|
||||
| tip | 当作为包裹元素时,可以自定义描述文案 | string | - |
|
||||
| wrapperClassName | 包装器的类属性 | string | - |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| delay | 延迟显示加载效果的时间(防止闪烁) | number (毫秒) | - | |
|
||||
| indicator | 加载指示符 | vNode \| slot | - | |
|
||||
| size | 组件大小,可选值为 `small` `default` `large` | string | `default` | |
|
||||
| spinning | 是否为加载中状态 | boolean | true | |
|
||||
| tip | 当作为包裹元素时,可以自定义描述文案 | string \| slot | - | slot 3.0 |
|
||||
| wrapperClassName | 包装器的类属性 | string | - | |
|
||||
|
||||
### 静态方法
|
||||
|
||||
|
|
|
@ -141,16 +141,19 @@
|
|||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
&:nth-child(2) {
|
||||
top: 0;
|
||||
right: 0;
|
||||
animation-delay: 0.4s;
|
||||
}
|
||||
|
||||
&:nth-child(3) {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
animation-delay: 0.8s;
|
||||
}
|
||||
|
||||
&:nth-child(4) {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
|
|
Loading…
Reference in New Issue