Components
TagInput 标签输入
将逗号分隔的文本转为可编辑、可删除的标签集合。
筛选值
输入后按 Enter、逗号或失焦即可添加;支持粘贴多个值。
生产环境 香港
支持 Enter、逗号与粘贴多个值。
当前值:生产环境, 香港
<TagInput
v-model="tags"
label="筛选标签"
placeholder="输入服务、地区或角色..."
hint="支持 Enter、逗号与粘贴多个值。"
/>自定义分隔符与数量限制
用多个分隔符接收批量角色 ID,并限制最多五项。
1234567890
<TagInput
v-model="roleIds"
label="Discord Role IDs"
:separator="[',', ';', '\n']"
:max="5"
/>API 参考
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
model-value | string[] | [] | v-model 标签值数组。 |
placeholder | string | 输入标签... | 无标签时的输入提示。 |
separator | string | string[] | ',' | 用于批量拆分输入和粘贴内容的分隔符。 |
unique | boolean | true | 是否忽略重复标签。 |
max | number | — | 可添加标签的最大数量。 |
add-on-paste | boolean | true | 是否将粘贴内容按分隔符批量添加。 |
size | 'sm' | 'md' | 'lg' | 'md' | 输入框尺寸。 |
disabled | boolean | false | 禁用添加和删除操作。 |