Form属性文档

本页对应 Avue 3.9.5 的 Form 与输入组件包装层。option 管理整表，column 管理字段；直接使用 avue-select 等组件时，属性位置与字典名称有所不同，见基础组件使用约定。

optionValidate 写在 option 中，或在安装 Avue 时全局设置，不是 <avue-form> 的独立 prop。尺寸依次读取 option.size、全局 formSize、全局 size，默认 default。

//3.4.1+支持
//form组件全局配置
app.use(Avue,{
  formOption:{},
  //3.9.2+支持，默认开启 option 配置校验
  optionValidate:true
})

//可以获取到el-form的内置ref对象
const formRef=ref(null)
formRef.value?.$refs.form // 在组件 mounted / nextTick 后访问

Form

参数	说明	类型	可选值	默认值
modelValue/v-model	绑定值	object	-	-
option	表单配置项参考Option配置	object	-	-
status / v-model:status	接收组件内部的提交锁定状态；该值用于观察状态，不作为外部禁用开关	boolean	true/false	false
upload-before	上传前钩子；done(newFile?) 继续上传，stop(error?) 中止当前处理	function	-	(file, done, stop, column) => {}
upload-after	上传成功后钩子；res 已按 propsHttp.res 取值，done(data?) 将结果写入绑定值，stop(error?) 放弃本次结果	function	-	(res, done, stop, column) => {}
upload-delete	删除前钩子；返回 Promise，resolve 继续删除，reject 阻止删除。第二个参数是列配置，不是文件列表	function	-	(file, column) => Promise
upload-preview	upload组件查看回调	function	-	(file,column,done)=>{}
upload-error	upload组件上传失败错误回调	function	-	(error,column)=>{}
upload-exceed	upload组件上传超过长度限制回调	function	-	(limit,files,fileList,column)=>{}
upload-sized 3.4.4	文件超出大小限制；fileSize 单位 KB，第二个参数为当前文件	function	-	(fileSize, file, fileList, column) => {}

Option

参数	说明	类型	可选值	默认值
size	组件尺寸	string	large/default/small	继承全局配置，默认 default
column	表单列配置参考Column相关配置	array	-	-
optionValidate 3.9.2	是否校验当前 option 配置，设置为 false 时只关闭当前表单配置校验	boolean	true/false	true
labelWidth	标题宽度；数字按 px 处理	number/string	-	90
labelPosition	标题位置	string	left/right/top	right
labelSuffix	标题的后缀	string	-	:
enter	回车按键触发提交表单	boolean	-	false
group	分组表单	array	-	-
tabs	选项卡表单(前提要配置group)	boolean	-	false
menuBtn	表单操作栏是否显示	boolean	-	true
menuSpan	表单操作菜单栅格占据的列数	number	-	24
menuPosition	表单操作菜单的位置	string	left/center/right	center
submitBtn	提交按钮	boolean	-	true
submitText	提交按钮文案	string	-	提交
emptyBtn	清空按钮	boolean	-	true
emptyText	清空按钮文案	string	-	清空
formWidth	表单宽度	number/string	-	100%
statusIcon / scrollToError / hideRequiredAsterisk	校验状态图标、滚动到错误、隐藏必填星号	boolean	true/false	继承 Element Plus
requireAsteriskPosition / scrollIntoViewOptions	星号位置与校验滚动配置	string / boolean / object	left/right；scrollIntoView 参数	继承 Element Plus
disabled / readonly / detail	整表禁用、只读、详情显示	boolean	true/false	false
span / gutter	默认字段栅格与行间距	number	span 为 1–24	12 / 0
footer	分组之后的尾部字段	array	Column[]	[]
tabsActive / tabsType	默认分组页签、页签样式	string	tabsType 为 card/border-card	首个分组 / -
tabsVerifyAll	页签表单是否校验全部分组	boolean	true/false	true
menuXsSpan	小屏幕操作区栅格	number	1–24	24
printBtn / mockBtn	显示打印、模拟数据按钮	boolean	true/false	false
submitIcon / emptyIcon	提交、清空按钮图标	string	-	内置图标
filterDic	不在表单对象中保留 $prop 字典标签	boolean	true/false	false
filterNull	过滤空字符串字段	boolean	true/false	false
filterParams	resetForm 清空时保留的字段；rowKey 也会保留	array	prop[]	[]

Column-共用属性

公共 change 传入 { value, column, dic, item, ...tableData }；支持焦点交互的组件在 focus/blur/click 对象中另含 event。下表按需解构部分字段，完整说明见事件参数。

参数	说明	类型	可选值	默认值
label	标签文本的内容	string	—	—
prop	标签文本的内容属性名称	string	—	-
control	字段控制器；返回以目标 prop 为键的配置对象，或返回该对象的 Promise	function	(value, form, label, column) => object/Promise	-
bind	深结构数据绑定路径，例如 user.name	string	—	-
type	字段类型，例如 input/select/date/dynamic	string	各组件类型	input
component	自定义组件，覆盖默认 type 对应的组件	string/object	-	-
params	额外传入字段组件的 props，覆盖同名列配置	object	-	{}
event	传入字段组件的事件监听器	object	{ eventName: callback }	{}
description / descClass	字段底部说明和样式类名	string	-	-
detail	以只读详情文字展示字段	boolean	true/false	false
rules	当前字段的校验规则数组	array	async-validator 规则	-
value	初始化默认值	-	-	-
disabled	禁用	boolean	—	false
order	位置排序，数字越大位置越靠前	number	—	-
size	组件尺寸	string	large/default/small	继承全局配置，默认 default
span	栅格占据的列数	number	-	12
gutter	栅格间隔	number	-	0
offset	栅格左侧的间隔格数	number	-	0
push	栅格向右移动格数	number	-	0
pull	栅格向左移动格数	number	-	0
row	栅格后面的内容是否从新的一行开始展示	boolean	-	false
display	栅格显示	boolean	-	true
separator	选项分隔符,dataType为string时生效	string	-	,
labelWidth	标题宽度；数字按 px 处理	number/string	-	90
labelPosition	标题位置	string	left/right/top	right
tip	内容提示辅助语	string	-	-
tipPlacement	内容提示辅助语位置	string	top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end	top
labelTip	标题提示辅助语	string	-	-
labelTipPlacement	标题提示辅助语位置	string	top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end	top
render 3.4.2	自定义字段渲染，返回 VNode；h 需要从 Vue 导入	function	—	({ column, dic, params, event, row, index }) => VNode

Column-字典属性

参数	说明	类型	可选值	默认值
props	数据字典属性的配置对象，具体参考Props参考配置	object	—	—
dicData	数据字典值	array/(function/promise)3.5.0	—	—
dicUrl	数据字典接口url地址	string	—	—
dicQuery	数据字典接口url携带请求参数	object	—	—
dicHeaders	数据字典接口url携带头部参数	object	—	—
dicFormatter	数据字典接口url返回数据格式化方法	function	—	(res)=>{return res}
dicMethod	字典请求方式；get 使用 params，其他方法使用 data	string	get/post 等	get
dicFlag	false 时跳过该列普通字典初始化	boolean	true/false	true
dataType	字段值类型转换	string	string/number/array/json 等	-

Column-Props

参数	说明	类型	可选值	默认值
label	选项标签为选项对象的某个属性值	string	—	label
value	选项的值为选项对象的某个属性值	string	—	value
children	选项的子选项为选项对象的某个属性值	string	—	children
disabled	选项的禁用为选项对象的某个属性值	string	—	disabled
desc / groups / leaf	选项说明、分组选项、懒加载末级标记的字段名	string	—	desc / groups / leaf
res	选项返回结构的层级(例如data.data)	string	—	-

Column-Input

参数	说明	类型	可选值	默认值
placeholder	输入框占位文本	string	-	请输入/请选择+label名称
clearable	是否可清空	boolean	-	true
readonly	是否只读	boolean	-	-
blur	在失去焦点时触发	function	-	({column,value})=>{}
focus	在获得焦点时触发	function	-	({column,value})=>{}
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
maxlength	原生属性，最大输入长度	number	-	-
minlength	原生属性，最小输入长度	number	-	-
prepend	头部文本	string	-	-
append	尾部文本	string	-	-
prependClick	头部文本点击事件	Function	-	-
appendClick	尾部文本点击事件	Function	-	-
prefixIcon	输入框头部图标	string	-	-
suffixIcon	输入框尾部图标	string	-	-
showPassword	是否显示切换密码图标	boolean	-	true
rows	输入框行数，仅 textarea；同时配置 minRows/maxRows 时由自动高度约束	number	-	-
showWordLimit	显示字数统计	boolean	true/false	false
formatters / parser	普通输入的显示格式化与解析函数	function	(value) => value	-
enter	字段回车回调，配置后优先于 option.enter 提交	function	({ value, column }) => void	-
minRows	自动高度的最少行数，仅 textarea	number	-	5
maxRows	自动高度的最多行数，仅 textarea	number	-	10

Column-Number

参数	说明	类型	可选值	默认值
placeholder	输入框占位文本	string	-	请输入/请选择+label名称
clearable	是否可清空	boolean	-	true
readonly	是否只读	boolean	-	-
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
precision	小数精度；未配置时不固定小数位	number	非负整数	-
min	设置计数器允许的最小值	number	-	-Infinity
max	设置计数器允许的最大值	number	-	Infinity
suffix 3.5.6	尾部文本	string	-	-
prefix 3.5.6	头部文本	string	-	-
suffixClick 3.5.6	尾部文本点击事件，参数为当前值	Function	-	-
prefixClick 3.5.6	头部文本点击事件，参数为当前值	Function	-	-
step	计数器步长	number	-	1
stepStrictly	值必须为步长倍数	boolean	true/false	false
controls	是否使用控制按钮	boolean	true/false	true
controlsPosition	控制按钮位置	string	right/空字符串（两侧）	right
align 3.7.2	文本对齐方式	string	left/center/right	left
disabledScientific 3.7.2	禁用科学计数法	boolean	true/false	false

Column-Select

参数	说明	类型	可选值	默认值
placeholder	输入框占位文本	string	-	请输入/请选择+label名称
clearable	是否可清空	boolean	-	true
readonly	是否只读	boolean	-	-
virtualize	开启虚拟Dom	boolean	true/false	false
blur	在失去焦点时触发	function	-	({column,value})=>{}
focus	在获得焦点时触发	function	-	({column,value})=>{}
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
cascader	级联的子节点prop	array	-	-
cascaderIndex	级联的默认选项序号	number	-	-
multiple	多选	boolean	true/false	false
limit	最大允许选择个数	number	-	-
tags	多选时是否将选中值按文字的形式展示	boolean	true/false	false
collapseTags 3.2.20	多选时是否将选中值按文字的形式展示	boolean	true/false	false
collapseTagsTooltip 3.2.20	当鼠标悬停于折叠标签的文本时，是否显示所有选中的标签。要使用此属性，collapseTags属性必须设定为 true	boolean	true/false	false
maxCollapseTags 3.2.20	需要显示的 Tag 的最大数量只有当 collapseTags 设置为 true 时才会生效。	number	正整数	继承 Element Plus
allowCreate	是否允许用户创建新条目，需配合 filterable 使用	boolean	true/false	false
filterable	是否可搜索	boolean	true/false	false
remote	是否为远程搜索	boolean	true/false	false
defaultFirstOption	在输入框按下回车，选择第一个匹配项。需配合 filterable 或 remote 使用	boolean	true/false	false
loadingText	远程加载时显示的文字	string	-	加载中
popperClass	下拉框的类名	string	-	-
popperAppendToBody	是否将弹出框插入至 body 元素。在弹出框的定位出现问题时，可将该属性设置为 false	boolean	-	true
emptyValues 3.4.4	组件的空值配置	array	-	-
valueOnClear 3.4.4	清空选项的值	string/number/boolean/function	-	-
removeTag 3.7.3	移除单个已选标签的回调，参数是标签值，不是事件对象	function	-	(tagValue) => {}
endReached 3.9.2	虚拟选择器滚动到底部时触发	function	-	({value,column,dic})=>{}

Column-Cascader

参数	说明	类型	可选值	默认值
placeholder	输入框占位文本	string	-	请输入/请选择+label名称
clearable	是否可清空	boolean	-	true
readonly	是否只读	boolean	-	-
blur	在失去焦点时触发	function	-	({column,value})=>{}
focus	在获得焦点时触发	function	-	({column,value})=>{}
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
showAllLevels	级联输入框中是否显示选中值的完整路径	boolean	true/false	true
tags	多选时是否将选中值按文字的形式展示	boolean	true/false	false
separator	选项分隔符	string	-	-
filterable	是否可搜索选项	boolean	true/false	false
filterMethod	自定义搜索逻辑，第一个参数是节点node，第二个参数是搜索关键词keyword，通过返回布尔值表示是否命中	function	-	-
expandTrigger	次级菜单的展开方式	string	click/hover	hover
multiple	是否多选	boolean	true/false	false
checkStrictly	是否严格的遵守父子节点不互相关联	boolean	true/false	false
emitPath	在选中节点改变时，是否返回由该节点所在的各级菜单的值所组成的数组，若设置false，则只返回该节点的值	boolean	true/false	true
lazy	是否动态加载子节点，需与 lazyLoad 方法结合使用	boolean	true/false	false
lazyLoad	加载动态数据的方法，仅在 lazy 为 true 时有效 function(node, resolve)，node为当前点击的节点，resolve为数据加载完成的回调(必须调用)	function	-	-
effect 3.7.2	Tooltip 主题色	string	dark/light	light
showCheckedStrategy 3.7.2	定义选中项回填的方式	string	SHOW_ALL/SHOW_PARENT/SHOW_CHILD	SHOW_ALL
virtualScroll 3.9.2	是否开启级联面板虚拟滚动	boolean	true/false	-
fitInputWidth 3.9.2	下拉面板宽度是否跟随输入框	boolean	true/false	-
height 3.9.2	级联面板高度	number	-	-
itemSize 3.9.2	虚拟滚动单项高度	number	-	-
popperClass	下拉框的类名	string	-	-

Column-Checkbox

参数	说明	类型	可选值	默认值
readonly	是否只读	boolean	-	-
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
all	是否启动全选	boolean	true/false	-
border	是否显示边框	boolean	true/false	-
min	可被勾选的 checkbox 的最小数量	number	-	-
max	可被勾选的 checkbox 的最大数量	number	-	-
fill	当按钮为活跃状态时的边框和背景颜色	string	-	#409eff
textColor	当按钮为活跃状态时的字体颜色	string	-	#ffffff

Column-Radio

参数	说明	类型	可选值	默认值
readonly	是否只读	boolean	-	-
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
border	显示边框	boolean	true/false	false
button	按钮组类型	boolean	true/false	false

Column-Date

参数	说明	类型	可选值	默认值
placeholder	输入框占位文本	string	-	请输入/请选择+label名称
shortcuts	日期快捷选项	array/function	[{ text, value }]	-
disabledDate	返回 true 时禁用对应日期	function	(date: Date) => boolean	-
unlinkPanels	范围面板左右月份独立切换	boolean	true/false	false
clearable	是否可清空	boolean	-	true
readonly	是否只读	boolean	-	-
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
prefixIcon	自定义前缀图标	string	-	-
startPlaceholder	日期/时间范围开始占位符	string	-	开始
endPlaceholder	日期/时间范围结束占位符	string	-	结束
rangeSeparator	选择范围时的分隔符	string	-	-
singlePanel 3.9.2	范围选择时是否使用单面板	boolean	true/false	-
valueFormat	真实值的时间格式	string	-	-
format	显示值时间格式	string	-	-
editable	是否允许直接输入	boolean	true/false	true
disabledHours / disabledMinutes / disabledSeconds	禁用时间单元的函数，返回数字数组	function	按底层时间选择器参数调用	-
defaultTime	选择日期时补齐的默认时刻；范围的两项分别对应开始/结束	string/Date/array	HH:mm:ss、Date 或两项数组；字符串支持自 3.9.5 起	-
defaultValue	面板初始显示值，包装层声明为 String/Array；字段初始选值请用 v-model 或 column.value	string/array	-	-
popperClass	下拉框的类名	string	-	-
showNow3.6.0	是否显示 now 按钮	boolean	-	false

Column-Time

参数	说明	类型	可选值	默认值
placeholder	输入框占位文本	string	-	请输入/请选择+label名称
clearable	是否可清空	boolean	-	true
readonly	是否只读	boolean	-	-
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
startPlaceholder	日期/时间范围开始占位符	string	-	开始
endPlaceholder	日期/时间范围结束占位符	string	-	结束
rangeSeparator	选择范围时的分隔符	string	-	-
valueFormat	真实值的时间格式	string	-	-
format	显示值时间格式	string	-	-
defaultValue	面板初始显示值，包装层声明为 String/Array；字段初始选值请用 v-model 或 column.value	string/array	-	-
popperClass	下拉框的类名	string	-	-

Column-Switch

参数	说明	类型	可选值	默认值
beforeChange 3.2.20	switch 状态改变前的钩子，调用done函数传入true/false	function	-	(done)=>{}
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
len	滑块宽度，未配置时由 Element Plus 决定	number	-	-
inlinePrompt 3.2.20	无论图标或文本是否显示在点内，只会呈现文本的第一个字符	boolean	-	false
activeIcon 3.2.20	switch 状态为 on 时所显示图标，设置此项会忽略 active-text	string	-	-
inactiveIcon 3.2.20	switch 状态为 off 时所显示图标，设置此项会忽略 inactive-text	string	-	-
activeActionIcon 3.2.20	on状态下显示的图标组件	string	-	-
inactiveActionIcon 3.2.20	off状态下显示的图标组件	string	-	-

Column-Upload

参数	说明	类型	可选值	默认值
accept	upload时文件类型	string/array	-	-
fileSize	上传文件的大小限制，单位为KB,超出大小回调upload-error函数进行操作	number	-	-
action	必选参数，上传的地址	string	-	-
propsHttp	返回数据结构体propsHttp配置	object	-	-
data	携带的附加参数	object	-	-
headers	携带的头部附加参数	object	-	-
limit	最大允许上传个数	number	-	-
fileType	如果没后缀，用来指定文件类型	string	-	img/audio/video
fileText	按钮上传文案	string	点击上传	-
listType	文件列表类型，picture-img 为单图模式	string	text/picture/picture-card/picture-img	空字符串
showFileList	是否显示已上传文件列表	boolean	true/false	true
multiple	是否支持多选文件	boolean	true/false	false
directory 3.8.0	是否支持上传文件夹。启用后，只能选择文件夹；选择文件夹后，文件夹内的文件将被扁平化处理	boolean	true/false	false
canvasOption	图片水印canvasOption配置	object	-	-
httpRequest	接管上传；config.file 是原始文件，组件不会继续默认请求或自动执行 before/after	function	(config, column) => void	-

Column-propsHttp

参数	说明	类型	可选值	默认值
home	图片的根路径地址，例如返回data:{url:' / xxxx.jpg',name:''},home属性为http://xxx.com/,则最终的图片显示地址为http://xxx.com/xxxx.jpg	string	-	-
res	返回结构体的层次，例如返回data:{url:'',name:''},则res配置为data	string	-	-
url	上传成功返回结构体的图片地址，例如返回data:{urlsrc:'',name:''},则url配置为urlsrc	string	-	-
name	上传成功返回结构体的图片名称，例如返回data:{urlsrc:'',namesrc:''},则name配置为namesrc，当listType为picture-img属性不存在	string	-	-
fileName	上传文件流时的名称	string	-	file

Column-canvasOption

参数	说明	类型	可选值	默认值
text	字体的文字	string	-	avuejs.com
fontFamily	字体类型	string	-	microsoft yahei
color	字体的颜色	string	-	#999
fontSize	字体的大小	string	-	16
opacity	文字的透明度	string	-	100
bottom	文字距离图片底部的距离	string	-	10
right	文字距离图片右边的距离	string	-	10
ratio	压缩图片比率0-1(可以是小数)	number	-	1

Column-Array/Url

参数	说明	类型	可选值	默认值
alone	单个模式	boolean	true/false	false
limit	最大框的个数	number	-	-

Column-Img

参数	说明	类型	可选值	默认值
alone	单个模式	boolean	true/false	false
limit	最大框的个数	number	-	-
fileType	如果没后缀，用来指定文件类型	string	-	img/audio/video

Column-Dynamic

外层列使用 type: 'dynamic'；行配置与回调放在 children 中，最大行数使用外层 max。

参数	说明	类型	可选值	默认值
max	最大可新增行数（外层 column）	number	-	-
children.type	子表布局	string	form/crud	crud
children.column	子表字段配置	array	-	[]
children.rowAdd	新增前钩子，done(defaultRow?) 完成新增	function	(done) => void	-
children.rowDel	删除前钩子，done() 完成删除	function	(row, done) => void	-
children.rowKey	表格型子表的稳定唯一主键	string	-	id
children.rowSort	开启表格型子表的行拖拽	boolean	true/false	false
children.sortableChange	排序结果回调；绑定数组自动同步	function	(oldIndex, newIndex, row, list) => void	-

Column-Tree

参数	说明	类型	可选值	默认值
placeholder	输入框占位文本	string	-	请输入/请选择+label名称
clearable	是否可清空	boolean	-	true
readonly	是否只读	boolean	-	-
blur	在失去焦点时触发	function	-	({column,value})=>{}
focus	在获得焦点时触发	function	-	({column,value})=>{}
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
multiple	多选	boolean	true/false	false
cacheData v3.2.20	懒加载节点的缓存数据，结构与数据相同，用于获取未加载数据的标签	array	-	-
tags	多选时是否将选中值按文字的形式展示	boolean	true/false	false
collapseTags 3.2.20	多选时是否将选中值按文字的形式展示	boolean	true/false	false
collapseTagsTooltip 3.2.20	当鼠标悬停于折叠标签的文本时，是否显示所有选中的标签。要使用此属性，collapseTags属性必须设定为 true	boolean	true/false	false
maxCollapseTags 3.2.20	需要显示的 Tag 的最大数量只有当 collapseTags 设置为 true 时才会生效。	number	正整数	继承 Element Plus
checkStrictly	选中时父子节点是否独立	boolean	true/false	单选 true，多选 false
accordion	是否每次只打开一个同级树节点展开	boolean	true/false	false
defaultExpandAll	是否默认展开所有节点	boolean	true/false	false
expandOnClickNode	是否在点击节点的时候展开或者收缩节点,如果为 false，则只有点箭头图标的时候才会展开或者收缩节点	boolean	true/false	false
checkOnClickLeaf 3.6.3	是否在点击叶子节点的时候选中节点的复选框	boolean	true/false	false
defaultExpandedKeys	默认展开的节点的 key 的数组	array	-	-
filterable	是否开启条件筛选	boolean	true/false	false
iconClass	自定义树节点的图标	string	-	-
parent	父类是否可以点击和选择	boolean	true/false	true
lazy	是否懒加载子节点，需与 treeLoad 结合使用	boolean	true/false	false
treeLoad	加载子树数据的方法，仅当 lazy 属性为true 时生效	function	-	-
nodeClick	节点被点击时的回调,共三个参数，依次为：传递给 data 属性的数组中该节点所对应的对象、节点对应的 Node、节点组件本身。	function	-	-
checked	当复选框被点击的时候触发共,两个参数，依次为：传递给 data 属性的数组中该节点所对应的对象、树目前的选中状态对象	function	-	-
popperClass	下拉框的类名	string	-	-

Column-Tag

参数	说明	类型	可选值	默认值
placeholder	输入框占位文本	string	-	请输入/请选择+label名称
clearable	是否可清空	boolean	-	true
readonly	是否只读	boolean	-	-
blur	在失去焦点时触发	function	-	({column,value})=>{}
focus	在获得焦点时触发	function	-	({column,value})=>{}
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
maxlength	原生属性，最大输入长度	number	-	-
minlength	原生属性，最小输入长度	number	-	-

Column-Mention

参数	说明	类型	可选值	默认值
placeholder	输入框占位文本	string	-	请输入/请选择+label名称
clearable	是否可清空	boolean	-	true
readonly	是否只读	boolean	-	-
blur	在失去焦点时触发	function	-	({column,value})=>{}
focus	在获得焦点时触发	function	-	({column,value})=>{}
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
max	最大允许选择个数	number	-	-
remote	是否为远程搜索	boolean	true/false	false
maxlength	原生属性，最大输入长度	number	-	-
minlength	原生属性，最小输入长度	number	-	-
prepend	头部文本	string	-	-
append	尾部文本	string	-	-
prependClick	头部文本点击事件	Function	-	-
appendClick	尾部文本点击事件	Function	-	-
prefixIcon	输入框头部图标	string	-	-
suffixIcon	输入框尾部图标	string	-	-

Column-Table

参数	说明	类型	可选值	默认值
formatter	单选接收记录，多选接收记录数组，返回显示文本	function	(recordOrRecords) => string	-
onLoad	回显与查询；value 存在时 callback(记录/数组)，列表时 callback({ total, data })	function	({ value, page, data }, callback) => void	-
beforeClose3.4.7	关闭前的回调，会暂停Dialog的关闭，done用于关闭Dialog	function	-	(done)=>{}

Column-Icon

参数	说明	类型	可选值	默认值
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
iconList	图标数组	array	-	-
beforeClose3.4.7	关闭前的回调，会暂停Dialog的关闭，done用于关闭Dialog	function	-	(done)=>{}

Column-Map

参数	说明	类型	可选值	默认值
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
params	高德地图的初始化参数	object	-	-
beforeClose3.4.7	关闭前的回调，会暂停Dialog的关闭，done用于关闭Dialog	function	-	(done)=>{}

Column-Color

参数	说明	类型	可选值	默认值
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
showAlpha	是否支持透明度选择	boolean	-	true
colorFormat	颜色的格式	string	hsl/hsv/hex/rgb	rgb
popperClass	下拉框的类名	string	-	-
predefine	预定义颜色	array	-	-

Column-Slider

参数	说明	类型	可选值	默认值
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
min	最小值	number	-	0
max	最大值	number	-	100
showInput	是否显示输入框，仅在非范围选择时有效	boolean	-	false
showInputControls	在显示输入框的情况下，是否显示输入框的控制按钮	boolean	-	true
vertical	是否竖向模式	boolean	-	false
height	Slider 高度，竖向模式时必填	string	-	-
step	步长	number	-	1
range	是否为范围选择	boolean	true/false	false
showInput	是否显示输入框，仅在非范围选择时有效	boolean	true/false	false
showStops	是否显示间断点	boolean	true/false	false
showTooltip	是否显示 tooltip	boolean	true/false	true
formatTooltip	格式化 tooltip message	function	true/false	-
tooltipClass	tooltip 的自定义类名	string	-	-
marks	标记， key 的类型必须为 number 且取值在闭区间 [min, max] 内，每个标记可以单独设置样式	object	-	-

Column-Rate

参数	说明	类型	可选值	默认值
change	值改变的时触发	function	-	({column,value})=>{}
click	点击时触发	function	-	({column,value})=>{}
max	最大分值	number	-	5
allowHalf	是否允许半选	boolean	-	false
lowThreshold	低分和中等分数的界限值，值本身被划分在低分中	number	-	2
highThreshold	高分和中等分数的界限值，值本身被划分在高分中	number	-	4
colors	icon 的颜色。若传入数组，共有 3 个元素，为 3 个分段所对应的颜色；若传入对象，可自定义分段，键名为分段的界限值，键值为对应的颜色	array/object	-	['#F7BA2A', '#F7BA2A', '#F7BA2A']
voidColor	未选中 icon 的颜色	string	-	#C6D1DE
disabledVoidColor	只读时未选中 icon 的颜色	string	-	#EFF2F7
iconClasses	icon 的类名。若传入数组，共有 3 个元素，为 3 个分段所对应的类名；若传入对象，可自定义分段，键名为分段的界限值，键值为对应的类名	array/object	-	['el-icon-star-on', 'el-icon-star-on','el-icon-star-on']
voidIconClass	未选中 icon 的类名	string	-	el-icon-star-off
disabledVoidIconClass	只读时未选中 icon 的类名	string	-	el-icon-star-on
showText	是否显示辅助文字，若为真，则会从 texts 数组中选取当前分数对应的文字内容	boolean	-	false
showScore	是否显示当前分数，show-score 和 show-text 不能同时为真	boolean	-	false
textColor	辅助文字的颜色	string	-	#1F2D3D
texts	辅助文字数组	array	-	['极差', '失望', '一般', '满意', '惊喜']
scoreTemplate	分数显示模板	boolean	-	{value}

Column-Input-Phone

参数	说明	类型	可选值	默认值
defaultPhoneCode	默认国际区号	string	-	+86
phoneCodeOptions	区号选项列表，格式为[{code:'+86',name:'中国',label:'🇨🇳 +86'}]	array	-	-
phoneMaxLength	手机号最大长度	number	-	11
phoneCodePlaceholder	区号选择器占位符	string	-	区号
phonePlaceholder	手机号输入框占位符	string	-	请输入手机号

Column-Input-Currency

参数	说明	类型	可选值	默认值
currency	货币类型	string	CNY/USD/EUR/GBP/JPY/HKD/KRW/SGD/AUD/CAD	CNY
currencySymbolCustom	自定义货币符号	string	-	-
currencyUnit	货币单位（如：元、万元）	string	-	-
currencyPrecision	小数位数	number	-	2
currencyPlaceholder	货币占位符	string	-	请输入金额
currencyMin	最小值	number	-	-
currencyMax	最大值	number	-	-

Column-Input-BankCard

参数	说明	类型	可选值	默认值
bankCardSeparator	分隔符	string	-	(空格)
bankCardSegment	分段长度	number	-	4
bankCardMaxDigits	银行卡最大长度（不含分隔符）	number	-	19
bankCardPlaceholder	银行卡占位符	string	-	请输入银行卡号
showBankCardType	是否显示银行卡类型	boolean	-	true

Column-Input-IdCard

参数	说明	类型	可选值	默认值
idCardPlaceholder	身份证占位符	string	-	请输入身份证号
showIdCardInfo	是否显示身份证信息	boolean	-	true
idCardRealtimeValidate	是否实时校验	boolean	-	true

Column-Input-Email

参数	说明	类型	可选值	默认值
emailPlaceholder	邮箱占位符	string	-	请输入邮箱
emailSuffixes	邮箱后缀建议列表	array	-	['@qq.com','@163.com',...]
showEmailSuffix	是否显示邮箱建议	boolean	-	true

Column-Input-Code

参数	说明	类型	可选值	默认值
codePlaceholder	验证码占位符	string	-	-
codeLength	验证码长度	number	-	6
codeSeparator	验证码分隔符	string	-	-

Column-Input-Otp 3.9.3

type 设置为 otp 或 input-otp。

参数	说明	类型	可选值	默认值
length	输入格数量	number	-	6
validator	单个字符校验函数，返回 false 时不接受输入	function	-	-
inputmode	原生输入模式	string	numeric 等	-
otpType	输入框外观	string	outlined/filled/underlined	outlined
mask	是否掩码显示	boolean	true/false	false
separator	分隔符	string/object/function	-	-
validateEvent	是否触发表单校验	boolean	true/false	true
id	输入框 ID	string	-	-
ariaLabel	无障碍标签	string	-	-
finish	输入完成回调	function	-	({ value })=>{}

Column-Input-Plate

参数	说明	类型	可选值	默认值
platePlaceholder	车牌号占位符	string	-	请输入车牌号
defaultPlateProvince	默认省份	string	-	京
plateProvinceList	省份列表	array	-	['京','津','沪',...]

Column-Input-Ip

参数	说明	类型	可选值	默认值
ipPlaceholder	IP地址占位符	string	-	请输入IP地址
ipVersion	IP版本	number	4/6	4

Column-Input-Mac

参数	说明	类型	可选值	默认值
macPlaceholder	MAC地址占位符	string	-	请输入MAC地址
macSeparator	MAC分隔符	string	😕-	:

Column-Input-Uscc

参数	说明	类型	可选值	默认值
usccPlaceholder	社会信用代码占位符	string	-	请输入统一社会信用代码
usccRealtimeValidate	是否实时校验	boolean	-	true

Column-Input-Cron

参数	说明	类型	可选值	默认值
placeholder	输入框占位文本	string	-	点击配置Cron表达式
clearable	是否可清空	boolean	-	true
prefixIcon	输入框头部图标	string	-	-
suffixIcon	输入框尾部图标	string	-	-
dialogWidth	弹窗宽度	string	-	700px

Events

事件名称	说明	参数
update:modelValue / change	表单对象更新；可包括 $prop 标签字段	form
update:status	内部提交/校验锁定状态更新	boolean
submit	校验通过后提交，返回数据已过滤 $ 前缀标签；完成请求后必须调用 done	(form, done)
error	提交校验未通过	errors
reset-change	resetForm 清空或仅清理校验后触发	—
tab-click	点击分组页签时透传 tab/event；折叠分组变化时为 activeNames	(tab, event) / activeNames
mock-change	模拟数据生成后触发	form
dic-error	字典请求失败	{ type, error }

Methods

先获取 Vue 模板 ref：脚本中使用 formRef.value，方法应在组件完成挂载后调用。

方法	说明	签名 / 返回值
submit	执行表单与 Dynamic 子表校验，通过后触发 submit，否则触发 error	submit(): void
validate	校验整表与可见 Dynamic 子表；通过时锁定表单，需要 done() 解锁	validate((valid, done, errors) => {}): void
validateField	透传 Element Plus 的部分字段校验；不额外遍历 Dynamic 子表	validateField(props?, callback?): Promise
clearValidate	清除指定字段或整表的校验结果，不修改值	clearValidate(props?): void
resetFields	透传 Element Plus，恢复已注册字段的初始值并清理校验	resetFields(props?): void
resetForm	默认清空表单字段，保留 filterParams 和 rowKey；false 时只清校验	resetForm(reset = true): void
updateDic	替换指定字典；省略 list 时请求该字段 dicUrl	updateDic(prop, list?): Promise，失败或字段不存在时为 null
dicInit	重新请求普通网络字典，不代表重新初始化整个表单	dicInit(): Promise
getPropRef	获取已渲染字段的包装实例，实际输入实例在 .$refs.temp	getPropRef(prop)
scrollToField	透传 Element Plus，滚动到字段	scrollToField(prop): void
getField	获取 Element Plus 的字段上下文，取决于所用 Element Plus 版本	getField(prop)

Avue 的 validate 不是 Element Plus 原生的同名方法，不支持通过 await formRef.value.validate() 判断结果；必须使用三个参数的回调。需要访问 Element Plus 的 fields 列表时使用 formRef.value.$refs.form.fields，它是属性，不是 Avue 的方法。

resetForm 的“清空”和 resetFields 的“还原初始值”语义不同。getPropRef 不适用于完全自定义插槽或未渲染的字段；调用前先判断实例是否存在。参见验证示例和表单提交。

全局工具

方法名称	说明	参数
validateOption 3.9.2	手动校验 Avue option 配置，返回 warning 数组	option, component
warnOption 3.9.2	将 `validateOption` 返回的 warning 按统一格式输出到控制台，同一 warning 只输出一次	warnings, component

Slot

名称	说明
'prop'	自定义表单内容，prop为对应列的字段名
'prop'-label	自定义表单的标题，prop为对应列的字段名
'prop'-error	自定义表单错误提示信息，prop为对应列的字段名
'prop'-desc 3.6.4	自定义表单描述信息，prop为对应列的字段名
menu-form	自定义表单操作菜单区域
menu-form-before 3.4.3	自定义表单操作菜单前的内容