44 lines
1.2 KiB
TypeScript
44 lines
1.2 KiB
TypeScript
import type { PropType } from 'vue'
|
|
import { Icon } from '@iconify/vue'
|
|
import { defineComponent } from 'vue'
|
|
import { getPrefixCls } from '../_utils/getPrefixCls'
|
|
|
|
export default defineComponent({
|
|
name: 'Icon',
|
|
props: {
|
|
icon: { type: String as PropType<string>, required: true },
|
|
size: { type: Number },
|
|
color: { type: String, default: 'currentColor' },
|
|
spin: { type: Boolean, default: false },
|
|
},
|
|
emits: ['click'],
|
|
setup(props, { slots, emit }) {
|
|
const prefixCls = getPrefixCls('icon')
|
|
const fontStyle = {
|
|
...(props.size ? { fontSize: `${props.size}px` } : {}), // size 存在才设置
|
|
verticalAlign: 'middle',
|
|
}
|
|
return () => (
|
|
<i
|
|
class={[prefixCls, props.spin && `${prefixCls}-spin`]}
|
|
style={fontStyle}
|
|
onClick={e => emit('click', e)}
|
|
>
|
|
{slots.default
|
|
? (
|
|
slots.default()
|
|
)
|
|
: props.icon
|
|
? (
|
|
<Icon
|
|
icon={props.icon}
|
|
color={props.color}
|
|
style={{ verticalAlign: 'middle' }}
|
|
/>
|
|
)
|
|
: null}
|
|
</i>
|
|
)
|
|
},
|
|
})
|