mirror of
https://github.com/antd-tiny-vue/antd-tiny-vue.git
synced 2024-11-10 09:39:15 +08:00
chore: change
This commit is contained in:
parent
7bc8ec1094
commit
786877b629
46
components/button/loading-icon.tsx
Normal file
46
components/button/loading-icon.tsx
Normal file
@ -0,0 +1,46 @@
|
|||||||
|
import { defineComponent } from 'vue'
|
||||||
|
import { booleanType, someType, stringType } from '@v-c/utils'
|
||||||
|
import LoadingOutlined from '@ant-design/icons-vue/LoadingOutlined'
|
||||||
|
|
||||||
|
export interface LoadingIconProps {
|
||||||
|
prefixCls: string
|
||||||
|
existIcon: boolean
|
||||||
|
loading?: boolean | object
|
||||||
|
}
|
||||||
|
export const loadingIconProps = {
|
||||||
|
prefixCls: stringType(),
|
||||||
|
existIcon: booleanType(),
|
||||||
|
loading: someType<boolean | object>([Boolean, Object])
|
||||||
|
}
|
||||||
|
|
||||||
|
// const getCollapsedWidth = (): CSSProperties => ({
|
||||||
|
// width: 0,
|
||||||
|
// opacity: 0,
|
||||||
|
// transform: 'scale(0)'
|
||||||
|
// })
|
||||||
|
//
|
||||||
|
// const getRealWidth = (node: HTMLElement): CSSProperties => ({
|
||||||
|
// width: node.scrollWidth,
|
||||||
|
// opacity: 1,
|
||||||
|
// transform: 'scale(1)'
|
||||||
|
// })
|
||||||
|
|
||||||
|
const LoadingIcon = defineComponent({
|
||||||
|
name: 'LoadingIcon',
|
||||||
|
props: loadingIconProps,
|
||||||
|
setup(props) {
|
||||||
|
return () => {
|
||||||
|
const { existIcon, prefixCls } = props
|
||||||
|
// const visible = !!loading
|
||||||
|
if (existIcon) {
|
||||||
|
return (
|
||||||
|
<span class={`${prefixCls}-loading-icon`}>
|
||||||
|
<LoadingOutlined />
|
||||||
|
</span>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
export default LoadingIcon
|
Loading…
Reference in New Issue
Block a user