Input 输入框
通过鼠标或键盘输入内容,可组合使用,常用于查询条件、表单、新建或修改等场景。 API文档 组件问题反馈和讨论使用方法
- 文本框一般用于接收较短的字符串,如账号、密码、姓名等。文本框高度和宽度固定,显示的文本一般左对齐。
- 当用户输入的内容超出文本框范围时显示最后输入的文本位置,横向滑动可查看已输入的内容。如要显示较长的字符串,请改用“多行文本框”。
基础样式 #
最基础输入框的使用状态有默认状态和禁用状态,只需要添加样式 nv-input ;input标签有 disabled 属性时会显示成禁用状态。<code>
输入框尺寸 #
定义了输入框三种尺寸:大、中(默认)、小;高度分别为 40px 32px 24px; 大尺寸和小尺寸需额外增加样式 nv-input-lg 和 nv-input-sm。<code>
可清除输入内容 #
输入状态下点击右侧icon,可清除输入内容;只需增加样式 nv-input-clear。<code>
带icon的输入框 #
带有icon的输入框,分为两种:可操作的icon置于输入框的右侧(默认状态);<code>
文本域 #
用于输入多行文本信息,需配置 maxlength 属性用于显示最大输入字符数。<code>
组合输入框 #
可前置或后置元素,一般为下拉标签或按钮;默认状态为标签,按钮需额外增加样式 nv-input-btn,input默认在右侧,如果在左侧需额外增加样式 nv-input-wapper-left<code>
自定义DOM监听事件 #
1.3.3版本后组件在原生的DOM对象上挂载了onnvchange方法,需要改变textarea后重新渲染页面的话可以使用此方法(需升级为1.3.3及以后的版本)。<code>
属性
|
类型
|
描述
|
---|
inserted
|
String
|
默认为false,动态改变输入框的值。eg:{inserted:'我是新添加的内容'}
|
beforeFn
|
Function
|
前置回调函数,在onnvchange最开始执行。eg: {beforeFn: function(){}}
|
afterFn
|
Function
|
后置回调函数,在onnvchange最后执行。eg: {afterFn: function(){}}
|