Tag 标签

进行标记和分类的小标签。

何时使用#

  • 用于标记事物的属性和维度。
  • 进行分类。

API#

参数 说明 类型 可选值 默认值
href 链接的地址,会传给 a 标签 string false
closable 标签是否可以关闭 boolean false
onClose 组合时根据此项判定checked function
color 标签的色彩 string blue green yellow red

代码演示

import { Tag } from 'antd';

function onClose(e) {
  console.log(e);
}

ReactDOM.render(<div>
  <Tag>标签一</Tag>
  <Tag>标签二</Tag>
  <Tag closable onClose={onClose}>标签三</Tag>
  <Tag href="http://www.baidu.com">标签四(链接)</Tag>
</div>, mountNode);

简单的标签展示,添加 closable 表示可关闭。

import { Tag } from 'antd';

ReactDOM.render(<div>
  <Tag closable color="blue">蓝色</Tag>
  <Tag closable color="green">绿色</Tag>
  <Tag closable color="yellow">黄色</Tag>
  <Tag closable color="red">红色</Tag>
</div>, mountNode);

四种颜色的标签。