Input Number 数字输入框

使用

import { KInputNumber } from "@ksware/ksw-ux";

仅允许输入标准的数字值，可定义范围

基础用法

要使用它，只需要在 <k-input-number> 元素中使用 v-model 绑定变量即可，变量的初始值即为默认值。

TIP

当输入无效的字符串到输入框时，由于错误，输入值将把 NaN 导入到上层

禁用状态

disabled 属性接受一个 Boolean，设置为 true 即可禁用整个组件。如果你只需要控制数值在某一范围内，可以设置 min 属性和 max 属性， 默认最小值为 0。

步进

允许定义递增递减的步进控制

设置 step 属性可以控制步长。

严格步进

step-strictly 属性接受一个 Boolean。 如果这个属性被设置为 true，则只能输入步进的倍数。

精度

设置 precision 属性可以控制数值精度，接收一个 Number。

TIP

precision 的值必须是一个非负整数，并且不能小于 step 的小数位数。

不同的输入框尺寸

使用 size 属性额外配置尺寸，可选的尺寸大小为：large 或 small

按钮位置

设置 controls-position 属性可以控制按钮位置。

自定义图标

使用 decrease-icon 和 increase-icon 设置自定义图标。

带前缀和后缀

使用前缀和标名后缀。

符号限制

设置 support-symbol 属性可以限制数学符号的输入，默认支持 +、-、.、e、E

如果只允许纯数字输入，可以设置 only-digits 属性

API

Props

参数名	描述	类型	默认值
model-value / v-model	绑定值	number	-
min	最小值	number	-Infinity
max	最大值	number	Infinity
step	计数步长	number	1
size	输入框大小	enum	'base'
step-strictly	是否只能输入 step 的倍数	boolean	false
precision	数值精度	number	-
disabled	是否禁用	boolean	false
readonly	是否只读	boolean	false
controls	是否使用控制按钮	boolean	-
controls-position	控制按钮位置	enum	-
only-digits 1.1.23	是否只能输入数字，正负号、小数点、科学计数法等都不允许输入	boolean	false
support-symbols 1.2.2	支持的数字符号，可选值为+、-、.、e、E	Array	['+', '-', '.', 'e', 'E']

Events

事件名	描述	类型
blur	输入框失去焦点时触发	Function
focus	输入框获得焦点时触发	Function
change	仅当 modelValue 改变时，当输入框失去焦点或用户按 Enter 时触发	Function

Slots

插槽名	描述	参数
decrease-icon	自定义输入框按钮减少图标	-
increase-icon	自定义输入框按钮增加图标	-

Methods

方法名	描述	类型
blur	使输入框失去焦点	Function
focus	使输入框获得焦点	Function