表单操作

表单的操作按钮可以通过配置或者自定义的方式实现

Action

action控制显示的按钮和顺序,可以按需求新增key(结合actionProps自定义按钮)

action: ['submit', 'reset',...]

ActionProps

actionProps控制按钮的属性

参数名称	类型	是否必选	说明
componentProps	object		按钮组件的 props 配置，如 'type'、'size'、'icon' 等
componentEvents	object		按钮组件的事件，如 'onClick' 等
text	string		按钮的文字

{
	
	submit: {
		componentProps: {
			type: 'primary',
			icon: 'search',
		},
		text: '检索',
	},
	reset: {
		componentProps: {
			type: 'default',
			icon: 'refresh',
		},
		text: '重置',
	},
	custom: {
		componentProps: {
			type: 'warning',
			icon: 'edit',
			round: true,
		},
		componentEvents: {
			onClick: () => {
			ElMessage.info('自定义事件')
			},
		},
		text: '自定义',
	},
}

示例

FooterRowProps

操作按钮的对齐方式依靠el-row的justify属性实现

示例

自定义表单操作按钮

可以通过show-footer设置为false，结合需要自行绘制或者其它方式通过method实现表单的校验