# Input 输入框
# Input 概述
基本表单组件，支持 input 和 textarea，并在原生控件基础上进行了功能扩展，可以组合使用。
# Input 代码演示
# 基础用法
基本用法，可以使用 v-model 实现数据的双向绑定。
可以直接设置 style 来改变输入框的宽度，默认 100%。
# 输入框类型
输入框有三种类型：text(文本框)、textarea(文本域)、password(密码框)
通过设置type为text、textarea、password分别设置为文本框、文本域、密码框，不设置默认为text。
# 尺寸
输入框有三种尺寸：大、默认（中）、小
通过设置size为large和small设置为大和小尺寸，不设置默认（中）尺寸。
# 占位文本
占位文本在没有输入框未输入值时显示。
通过设置placeholder占位文本。
# 带Icon的输入框
通过 icon 属性可以在输入框右边加一个图标。
点击图标，会触发 on-click 事件。
# 文本域
通过设置属性 type 为 textarea 来使用文本域，用于多行输入。
通过设置属性 rows 控制文本域默认显示的行数。
# 适应文本高度的文本域
设置属性 autosize，文本域会自动适应高度的变化。
autosize也可以设定为一个对象，指定最小行数和最大行数。
# 禁用状态
通过添加disabled属性可设置为不可用状态。
# 只读状态
通过添加readonly属性可设置为只读状态。
不可以通过键盘来修改值，通过API等可以设置值。
# 最大输入长度
配置maxlength属性来限制输入框输入长度。
# 自动获取焦点
配置autofocus属性页面初始化时输入框自动获取焦点，建议放在表单第一个输入框中。
# 复合型输入框
通过前置和后置的 slot 可以实现复合型的输入框。
# 事件
on-enter事件在按下回车键时触发。
on-change事件在输入值发生改变时触发。
on-focus事件在输入框获取焦点时触发。
on-blur事件在输入框失去焦点时触发。
on-keyup事件在抬起任意按键时触发。
on-keydown事件在按下任意按键时触发。
on-keypress事件在按下字母数字按键时触发。
# 手动聚焦输入框方法
通过配置focus方法手动获取输入框焦点。
# 特殊字符禁止输入正则表达式
此输入框不支持'a'的输入。
# Input API
# Input props
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| type | 输入框类型，可选值为 text、password、textarea 或 int(v1.0.33) | String | text |
| value | 绑定的值，可使用 v-model 双向绑定 | String | Number | 空 |
| size | 输入框尺寸，可选值为large和small或者不设置 | String | - |
| placeholder | 占位文本 | String | - |
| disabled | 设置输入框为禁用状态 | Boolean | false |
| readonly | 设置输入框为只读 | Boolean | false |
| maxlength | 最大输入长度 | Number | - |
| icon | 输入框尾部图标，仅在 text 类型下有效 | String | - |
| rows | 文本域默认行数，仅在 textarea 类型下有效 | Number | 2 |
| autosize | 自适应内容高度，仅在 textarea 类型下有效，可传入对象，如 { minRows: 2, maxRows: 6 } | Boolean | Object | false |
| autofocus | 自动获取焦点 (chrome的hash模式下暂不支持) | Boolean | false |
| algin | 文本显示位置 left center right | String | left |
| strengthTip | 是否许需要密码强度提示 type=password有效 | Boolean | false |
| tipState | 密码强度提示状态，可选状态 type=password有效 weak general complex | String | null |
| canResize | 组件type属性为textarea时是否可以拖动（此属性只在19版本及以上有效） | Boolean | true |
| filterRE | 特殊字符禁止输入正则表达式（此属性只在24版本及以上有效） | RegExp | null |
| lengthByByte | 是否按照字节长度计算输入框的maxlength（此属性只在1.0.25版本及以上有效，textarea设置了maxlength并添加此属性后，用中文输入超过最大值后，无法撤销） | Boolean | false |
| specialFilter | 特殊过滤配置，可输入正数，开启后specialLength和specialDecimal起效（v1.0.26） | Boolean | false |
| specialLength | 可输入数字（包括整数和小数）位数（v1.0.26） | Number | 12 |
| specialDecimal | 可输入小数最大位数（v1.0.26） | Number | 2 |
| autocomplete | 规定输入字段是否应该启用自动完成功能（v1.0.28） | String | off |
| focusAllSelect | 聚焦时全选中控件内容,只支持text类型（v1.0.31） | Boolean | false |
| keyUpMode | 键盘松开触发input事件，（键盘松开触发进行双向绑定）（v1.0.32） | Boolean | false |
| showWordLimit | 显示长度限制提示，请确保设置 type = "textarea" 和 maxlength，生效时 width 固定宽度为 100%（v1.0.37） | Boolean | false |
| clearable | 是否显示清除图标按钮，type为text类型点击清空输入框的值，默认不显示，带有append时暂不支持。不建议与readOnly同时使用 （v1.0.38） | Boolean | false |
| limitTip | 长度限制提示的单位，显示长度限制提示时有效，（v1.0.42） | String | -- |
| byteNum | 非英文字符字节占位符（v1.0.46） | Number | 2 |
| tabindex | 设置输入框tabindex（v1.0.47） | String | Number | 0 |
| showWordByByte | 需配置showWordLimit，lengthByByte，按照字节计maxlength,但限制字符实际显示按照最大中文数计【类似maxlength:20, byteNum: 2, 显示为10，输入中文+1，输入英文以2为单位+1递增】 （v1.0.62） | Boolean | false |
| titleShow | input title是否显示 （v1.0.62） | Boolean | false |
# Input events
| 事件名 | 说明 | 返回值 |
|---|---|---|
| on-enter | 按下回车键时触发 | 无 |
| on-click | 设置 icon 属性后，点击图标时触发 | 无 |
| on-change | 数据改变时触发 | event |
| on-focus | 输入框聚焦时触发 | 无 |
| on-blur | 输入框失去焦点时触发 | 无 |
| on-keyup | 原生的 keyup 事件 | event |
| on-keydown | 原生的 keydown 事件 | event |
| on-keypress | 原生的 keypress 事件 | event |
| on-clear | 配置clearable true时，点击清除按钮时触发事件（v1.0.38） | event |
# Input slot
| 名称 | 说明 |
|---|---|
| prepend | 前置内容，仅在 text 类型下有效 |
| append | 后置内容，仅在 text 类型下有效 |
# Input methods
| 方法名 | 说明 | 参数 |
|---|---|---|
| focus | 手动聚焦输入框(this.$refs.xxx.focus()) | 无 |
| blur | 手动取消输入框焦点(this.$refs.xxx.blur())(此属性只在1.0.10或以上版本有效) | 无 |