Skip to content

TagInput

Rules

Basic Example

js
const rule = {
    type:"tagInput",
    title:"Tags",
    field:"tagInput",
    value: [],
    props: {
        clearable: true,
    },
}

Props Configuration Examples

Limit Tag Count

js
const rule = {
    type:"tagInput",
    title:"Product Tags",
    field:"tags",
    value: [],
    props: {
        max: 5,
        placeholder: "Enter tags, press Enter to confirm",
        clearable: true,
    }
}

Disabled State

js
const rule = {
    type:"tagInput",
    title:"Tags",
    field:"tags",
    value: ["Hot Sale", "New Product"],
    props: {
        disabled: true,
    }
}

Events Examples

Listen to Changes

js
const rule = {
    type:"tagInput",
    title:"Product Tags",
    field:"tags",
    value: [],
    props: {
        placeholder: "Enter tags",
        clearable: true,
    },
    on: {
        change: (value, context) => {
            console.log('Tags changed:', value, context);
        },
        enter: (value, context) => {
            console.log('Pressed Enter:', value, context);
        },
    },
}

Complete configuration items: TDesign_Tag_Input

value :Array

FormCreate is an open-source project released under the MIT License. Free for personal and commercial use.