CustomTag 自定义标签

一个简单的自定义标签组件，支持自定义文字、颜色和背景色。

基础用法

默认标签自定义颜色自定义插槽内容

复制代码

查看代码

<template>
    <a-flex align="center" :gap="16">
      <STag text="默认标签" />
      <STag text="自定义颜色" color="#fff" bgColor="#1890ff" />
      <STag bgColor="#1890ff">
        <template #default>
          <SIconFont type="user" color="#fff"></s-icon-font>
          <span style="color: #fff">自定义插槽内容</span>
        </template>
      </STag>
    </a-flex>
</template>
<script setup lang="ts">
</script>

<style scoped>

</style>

API

Props

参数	说明	类型	默认值
text	标签文本内容	string	-
color	文字颜色	string	'#333'
bgColor	背景颜色	string	'#fff'

Slots

名称	说明
default	自定义标签内容

样式

组件使用以下 CSS 类名，你可以通过覆盖这些类名来自定义样式：

类名	说明
custom-tag	标签根元素