基础输入框
@beisen-phoenix/input
简介
通过鼠标或键盘输入内容,是最基础的表单域的包装。
API
| 参数 | 说明 | 类型 | 默认值 | 是否必传 |
|---|---|---|---|---|
| type | 输入框类型,仅支持 text password hidden |
string | text | 否 |
| size | 输入框尺寸,支持 default large small |
string | default | 否 |
| value | 输入框内容 | string | - | 否 |
| defaultValue | 输入框默认内容,若使用了 value,则 defaultValue 无效 | boolean | - | 否 |
| placeholder | 同原生 input | string | 请输入 |
否 |
| status | 输入框状态,正常、禁用、提示、错误,支持 normal disabled isHint error |
string | normal | 否 |
| readOnly | 只读状态,不能输入,不显示清除按钮 | boolean | false | 否 |
| autoFocus | 首次挂载时是否自动获取焦点 | boolean | false | 否 |
| preventScrollOnFocus | 自动获取焦点时,是否阻止跳到焦点可视区域,跳动会点起闪屏,因此加此属性 | boolean | false | 否 |
| maxLength | 最大输入字符数,同原生 input | number | - | 否 |
| prefix | 前缀元素 | React.ReactNode | - | 否 |
| suffix | 后缀元素,同 prefix | React.ReactNode | - | 否 |
| translation | 国际化,详情见下方 | object | - | 否 |
| onChange | 输入框内容变化时的回调 | function(value: string) | - | 否 |
| onFocus | 获取焦点时的回调 | function(value: string) | - | 否 |
| onBlur | 失去焦点时的回调 | function(value: string,event) | - | 否 |
| onEnter | 按下回车的回调 | function(value: string) | - | 否 |
| onClear | 按下清除图标的回调 | function() | - | 否 |
| onClick | 点击输入框时的回调 | function(event) | - | 否 |
| onKeyDown | 键盘按下的回调 | function(event) | - | 否 |
| onCompositionStart | 开始新的输入合成时会触发(例如:开始中文输入) | function(event) | - | 否 |
| onCompositionUpdate | 在编辑器里的内容改变之前就会触发 | function(event) | - | 否 |
| onCompositionEnd | 文本段落的组成完成或取消时触发(例如:中文输入完成) | function(event) | - | 否 |
| onCopy | 复制的回调 | function(event) | - | 否 |
| onPaste | 粘贴的回调 | function(event) | - | 否 |
| onCut | 剪切的回调 | function(event) | - | 否 |
| extraCls | 自定义组件容器 class,一般用于覆盖组件默认样式使用 | string | - | 否 |
| clearFocus | 输入框激活时 点击清除按钮 输入框是否激活 | boolean | false | 否 |
| allowPoprationOnClear | 点击清除按钮时,click 事件是否冒泡 | boolean | false | 否 |
| lang | 当前语言环境(zh_CN,en_US,zh_TW) | string | zh_CN | 否 |
| showDelete | 是否显示清空图标 | boolean | true | 否 |
| autoComplete | 设置自动填充功能 | string | - | 否 |
| sizeOfInputAttribute | input自身的size属性 | number | - | 否 |
| showValueTooltip | 编辑状态,输入文本超长时,失焦是否显示tooltip | boolean | - | 否 |
| keepFocusOnClear | 点击清空的时候保持焦点,且不会触发一瞬间的失焦 | boolean | - | 否 |
相关说明
translation
translation: {
placeholder: '请输入'
}