InputTag 标签输入框

允许用户通过输入并回车快速添加标签，常用于关键词、邀请人等场景。

import { createApp } from 'vue'
import { ElInputTag } from '@szhn/dh-design-pc'

const app = createApp()
app.use(ElInputTag)

基础用法

输入内容后按回车即可添加为标签。

自定义触发器

通过 trigger 自定义添加标签的按键，默认值为 Enter，也支持 Space。

最大标签数

通过 max 限制可添加的标签数量，达到上限后将无法继续输入。

折叠标签

通过 collapse-tags 将多余标签合并为一个占位，配合 collapse-tags-tooltip 可在悬停时展开。

尺寸

通过 size 属性切换 large / default / small 三种尺寸。

可清空与禁用

通过 clearable 显示清空按钮，通过 disabled 禁用整个组件。

API

Attributes

属性	说明	类型	默认值
model-value / v-model	标签数组	string[]	—
max	最大标签数	number	—
trigger	触发添加的按键	Enter / Space	Enter
size	尺寸	large / default / small	—
tag-type	标签类型	enum	info
tag-effect	标签效果	light / dark / plain	light
draggable	标签是否可拖拽	boolean	false
clearable	是否可清空	boolean	false
disabled	是否禁用	boolean	false
collapse-tags	是否折叠标签	boolean	false
max-collapse-tags	折叠时展示的标签数	number	1
delimiter	分隔符触发添加	string / RegExp	—

Events

事件	说明
change	值变化
add-tag / remove-tag	添加 / 移除标签
clear	点击清除按钮
focus / blur	获焦 / 失焦

更多 API 请参考 Element Plus InputTag 文档。