Skip to content

InputNumber 数字输入框

通过鼠标或键盘,输入范围内的数值。

基本使用

基本使用。

三种大小

我们为<Input />输入框定义了三种尺寸(大、默认、小),高度分别为40px32px24px

前置/后置标签

使用addonBefore插槽自定义前置标签,addonAfter插槽自定义后置标签。

不可用

禁用的输入框。

精度限制

使用precision属性指定精度,为0表示只能输入整数。

格式化展示

通过formatter格式化数字,以展示具有具体含义的数据。此属性只控制展示效果,如果使用了bind:value的话,value永远为数字

需要获取格式化数字,可通过inputchange事件获取。默认如果存在formatterinputchange事件返回的值是数字,如果需要格式化数字则可以使用isParse=false

再次说明:isParse属性只控制inputchange事件中的值,不控制valuevalue永远为数字

键盘行为

使用keyboard属性可以控制键盘行为。

无边框

没有边框。

前置内容

使用prefix插槽自定义前置内容。

Input Props 属性

属性说明类型默认值版本
allowClear可以点击清除图标删除内容booleanfalse
bordered是否有边框booleantrue
defaultValue输入框默认内容string-
disabled设置按是否禁用状态booleanfalse
id输入框的idstring-
maxLength最大长度number-
showCount是否展示字数booleanfalse
status设置校验状态error | warning-
size控件大小。large | middle | smallmiddle
type声明input类型,同原生input标签的type属性,见:MDN(请直接使用Input.TextArea代替type="textarea")stringtext
value输入框内容string-

Events 事件

事件说明类型
input输入事件(value: CustomEvent<string>) => void
change输入改变事件ChangeEventHandler<HTMLInputElement> | undefined | null
blur失去焦点事件FocusEventHandler<T> | undefined | null
focus获取焦点事件FocusEventHandler<T> | undefined | null
keyup键盘抬起事件KeyboardEventHandler<T> | undefined | null
keydown键盘按下事件KeyboardEventHandler<T> | undefined | null
keypress键盘按下并松开事件KeyboardEventHandler<T> | undefined | null
mouseenter鼠标移入事件MouseEventHandler<T> | undefined | null
mouseleave鼠标移出事件MouseEventHandler<T> | undefined | null
mousemove鼠标移动事件MouseEventHandler<T> | undefined | null

Slots 插槽

插槽名说明
addonBefore带标签的input,设置前置标签
addonAfter带标签的input,设置后置标签
prefix带有前缀图标的input
suffix带有后缀图标的input

Input.Search Props 属性

属性说明类型默认值版本
enterButton是否有确认按钮,可设为按钮文字。booleanfalse
loading搜索 loadingbooleanfalse

其余属性和Input一致。

Events 事件

事件说明类型
search点击搜索图标或按下回车键时的回调(value: CustomEvent<string>) => void

其余事件和Input一致。

Slots 插槽

除了没有addonAfter插槽,其他的和Input一致。

Input.Password Props 属性

属性说明类型默认值版本
visible是否显示密码booleanfalse

其余属性和Input一致。

Events 事件

事件说明类型
visibleChange显隐密码的回调(value: CustomEvent<boolean>) => void

其余事件和Input一致。

Slots 插槽

除了没有suffix插槽,其他的和Input一致。

Input.TextArea Props 属性

属性说明类型默认值版本
allowClear可以点击清除图标删除内容booleanfalse
bordered是否有边框booleantrue
defaultValue输入框默认内容string-
disabled设置按是否禁用状态booleanfalse
maxLength最大长度number-
showCount是否展示字数booleanfalse
status设置校验状态error | warning-
value输入框内容string-

Events 事件

事件和Input一致。