Skip to content

RangeInput 范围输入框

规则

基础示例

Props 配置示例

分隔符自定义

禁用状态

只读

Events 事件示例

监听范围变化

完整配置项:TDesign_Range_Input

valueArray<string | number>

Props

参数说明类型默认值版本
activeIndex输入框高亮状态序号number--
borderless无边框模式booleanfalse-
clearable是否可清空booleanfalse-
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内容为空时悬浮是否显示清空booleanfalse-
size尺寸small | medium | largemedium-
status状态default | success | warning | errordefault-
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-

FormCreate 是一个开源项目,基于 MIT 许可证发布,欢迎个人和企业用户免费使用