mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-08-29 20:29:46 +08:00
51 lines
1.1 KiB
TypeScript
51 lines
1.1 KiB
TypeScript
import { PropType } from 'vue';
|
|
import { addUnit, createNamespace } from '../utils';
|
|
import Badge from '../badge';
|
|
|
|
const [createComponent, bem] = createNamespace('icon');
|
|
|
|
function isImage(name?: string) {
|
|
return name ? name.indexOf('/') !== -1 : false;
|
|
}
|
|
|
|
export default createComponent({
|
|
props: {
|
|
dot: Boolean,
|
|
name: String,
|
|
size: [Number, String],
|
|
badge: [Number, String],
|
|
color: String,
|
|
tag: {
|
|
type: String as PropType<keyof HTMLElementTagNameMap>,
|
|
default: 'i',
|
|
},
|
|
classPrefix: {
|
|
type: String,
|
|
default: bem(),
|
|
},
|
|
},
|
|
|
|
setup(props, { slots }) {
|
|
return () => {
|
|
const { tag, dot, name, size, badge, color, classPrefix } = props;
|
|
const isImageIcon = isImage(name);
|
|
|
|
return (
|
|
<Badge
|
|
dot={dot}
|
|
tag={tag}
|
|
content={badge}
|
|
class={[classPrefix, isImageIcon ? '' : `${classPrefix}-${name}`]}
|
|
style={{
|
|
color,
|
|
fontSize: addUnit(size),
|
|
}}
|
|
>
|
|
{slots.default?.()}
|
|
{isImageIcon && <img class={bem('image')} src={name} />}
|
|
</Badge>
|
|
);
|
|
};
|
|
},
|
|
});
|