RangeInput 范围输入框
规则
基础示例
Props 配置示例
分隔符自定义
禁用状态
只读
Events 事件示例
监听范围变化
完整配置项:TDesign_Range_Input
value:Array<string | number>
Props
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|---|---|---|---|---|
| activeIndex | 输入框高亮状态序号 | number | - | - |
| borderless | 无边框模式 | boolean | false | - |
| clearable | 是否可清空 | boolean | false | - |
| disabled | 是否禁用 | boolean | Array<boolean> | - | - |
| format | 展示值格式 | InputFormatType | Array<InputFormatType> | - | - |
| inputProps | 透传 Input 属性(数组对应两个输入框) | InputProps | Array<InputProps> | - | - |
| label | 左侧内容 | string | TNode | - | - |
| placeholder | 占位符 | string | Array<string> | - | - |
| prefixIcon | 前置图标 | TNode | - | - |
| readonly | 只读 | boolean | - | - |
| separator | 范围分隔符 | string | TNode | - | - |
| showClearIconOnEmpty | 内容为空时悬浮是否显示清空 | boolean | false | - |
| size | 尺寸 | small | medium | large | medium | - |
| status | 状态 | default | success | warning | error | default | - |
| suffix | 后置内容 | string | TNode | - | - |
| suffixIcon | 后置图标 | TNode | - | - |
| tips | 下方提示文本 | string | TNode | - | - |
| value | 范围值 | Array<InputValue> | [] | - |
| defaultValue | 非受控范围值 | Array<InputValue> | [] | - |
Events
| 事件 | 说明 | 类型 | 版本 |
|---|---|---|---|
| blur | 失去焦点 | (value, context?: { e?: FocusEvent; position?: 'first' | 'second' | 'all' }) => void | - |
| change | 值变化 | (value, context?: { e?: InputEvent | MouseEvent | CompositionEvent; position?: RangeInputPosition; trigger?: 'input' | 'initial' | 'clear' }) => void | - |
| clear | 清空 | (context: { e: MouseEvent }) => void | - |
| click | 点击 | (context?: { e?: MouseEvent; position?: RangeInputPosition }) => void | - |
| enter | 回车 | (value, context?: { e?: InputEvent | MouseEvent; position?: RangeInputPosition }) => void | - |
| focus | 获得焦点 | (value, context?: { e?: FocusEvent; position?: RangeInputPosition }) => void | - |
| mouseenter | 鼠标进入 | (context: { e: MouseEvent }) => void | - |
| mouseleave | 鼠标离开 | (context: { e: MouseEvent }) => void | - |


