输入框

介绍

基本表单组件，用于用户直接输入数据。

API

Props

Props 属性

参数	说明	类型	默认值
默认状态	组件的状态, "默认"|"禁用"|"隐藏"|"只读"	string	'default'
标题	组件的标题文案	string	'输入框'
显示标题	是否显示标题	boolean	true
默认值	组件的默认值类型，"自定义"|"公式编辑"	string	'custom'
编辑默认值	组件的默认值配置，支持绑定变量	string	-
公式编辑	配置默认值的公式	string	-
占位提示	配置组件占位符的文案	string	-
字段占比	组件宽度在父容器中的占比，"25%"|"50%"|"75%"|"100%"	string	'100%'
数据字段	表单字段名	string	"INPUT_随机八位字符"
清除按钮	是否开启清除按钮	boolean	false

Props 样式

参数	说明	类型	默认值
自定义样式	表格整体自定义样式	string	-
盒子模型属性设置	设置组件的盒子模型相关的各项样式属性值,包括margin、border、padding	-	-
边框颜色	边框的风格设置，"浅"	"一般"	"深/悬浮"
边框线形	设置边框线性，"实线"	"点线"	"虚线"

Props 高级

参数	说明	类型	默认值
唯一标识	组件的唯一标识	string	-
补充说明	表单项底部的说明文字	string	''
必填	未输入内容时校验不通过	boolean	false
最小长度	输入框内容小于最小长度时校验不通过	boolean	false
最大长度	输入框内容大于最大长度时校验不通过	boolean	false
邮箱	输入框内容非邮箱格式时校验不通过	boolean	false
手机号	输入框内容非手机号格式时校验不通过	boolean	false
自定义函数	自定义校验函数，可配置校验规则与校验提示内容	boolean	false
气泡提醒	组件旁边图标悬浮显示的说明性文字	string	-
前缀类型	前缀的类型，"text"	"icon"	string
前缀标签	前缀中的文案内容	string	-
前置类型	前置标签的类型，"text"	"icon"	string
前置标签	前置标签中的文案内容	string	-
点击前置标签	前置标签点击触发	action	-
后缀类型	后缀的类型，"text"	"icon"	string
后缀标签	后缀中的文案内容	string	-
后置类型	后置标签的类型，"text"	"icon"	string
后置标签	后置标签中的文案内容	string	-
点击后置标签	后置标签点击触发	action	-
循环	循环渲染设置	-	-

Events

Events 属性

事件名	说明	回调参数
onInput	用户输入时触发	ctx, params: { value:string }, loopDataList: LoopData[]
onChange	输入框失焦或按下回车时触发	ctx, params: { value:string }, loopDataList: LoopData[]
onFocus	获得焦点时触发	ctx, params: FocusEvent, loopDataList: LoopData[]
onBlur	输入框失焦或按下回车时触发	ctx, params: FocusEvent, loopDataList: LoopData[]
onPressEnter	按下回车时触发	ctx, params: { value:string }, loopDataList: LoopData[]
onClear	点击清除按钮时触发	ctx, params: PointerEvent, loopDataList: LoopData[]
onPaste	粘贴内容时触发	ctx, params: { event:ClipboardEvent, pasteValue:string }, loopDataList: LoopData[]

Type

LoopData

参数名	描述	类型
indexName	索引变量名	string
paramName	迭代变量名	string
row	当前迭代数据元素	any
rowIndex	当前迭代数据索引	any
ref	完整循环数组数据	ComputedRefImpl<Array>