RangeInput

Rules

Basic Example

const rule = {
    type:"rangeInput",
    title:"Price Range",
    field:"priceRange",
    value: [],
    props: {
        placeholder: ["Min Price", "Max Price"],
        clearable: true,
    },
}

Props Configuration Examples

Custom Separator

const rule = {
    type:"rangeInput",
    title:"Price Range",
    field:"priceRange",
    value: [],
    props: {
        placeholder: ["Min Price", "Max Price"],
        separator: "~",
        clearable: true,
    }
}

Disabled State

const rule = {
    type:"rangeInput",
    title:"Price Range",
    field:"priceRange",
    value: [100, 500],
    props: {
        disabled: true,
    }
}

Events Examples

Listen to Changes

const rule = {
    type:"rangeInput",
    title:"Price Range",
    field:"priceRange",
    value: [],
    props: {
        placeholder: ["Min Price", "Max Price"],
        clearable: true,
    },
    on: {
        change: (value, context) => {
            console.log('Range changed:', value, context);
        },
        enter: (value, context) => {
            console.log('Pressed Enter:', value, context);
        },
    },
}

Complete configuration items: TDesign_Range_Input

value :Array