feat(form): 支持配置阻止默认的submit行为

This commit is contained in:
roymondchen 2024-10-09 16:07:49 +08:00 committed by roymondchen
parent d33ddcfa65
commit 12ce5c568e
4 changed files with 15 additions and 1 deletions

View File

@ -7,6 +7,7 @@
:style="`height: ${height}`" :style="`height: ${height}`"
:inline="inline" :inline="inline"
:label-position="labelPosition" :label-position="labelPosition"
@submit="submitHandler"
> >
<template v-if="initialized && Array.isArray(config)"> <template v-if="initialized && Array.isArray(config)">
<Container <Container
@ -61,6 +62,7 @@ const props = withDefaults(
labelPosition?: string; labelPosition?: string;
keyProp?: string; keyProp?: string;
popperClass?: string; popperClass?: string;
preventSubmitDefault?: boolean;
extendState?: (state: FormState) => Record<string, any> | Promise<Record<string, any>>; extendState?: (state: FormState) => Record<string, any> | Promise<Record<string, any>>;
}>(), }>(),
{ {
@ -107,8 +109,8 @@ const formState: FormState = reactive<FormState>({
post: (options: any) => { post: (options: any) => {
if (requestFuc) { if (requestFuc) {
return requestFuc({ return requestFuc({
...options,
method: 'POST', method: 'POST',
...options,
}); });
} }
}, },
@ -167,6 +169,12 @@ const changeHandler = () => {
emit('change', values.value); emit('change', values.value);
}; };
const submitHandler = (e: SubmitEvent) => {
if (props.preventSubmitDefault) {
e.preventDefault();
}
};
defineExpose({ defineExpose({
values, values,
lastValuesProcessed, lastValuesProcessed,

View File

@ -12,6 +12,7 @@
:label-width="labelWidth" :label-width="labelWidth"
:label-position="labelPosition" :label-position="labelPosition"
:inline="inline" :inline="inline"
:prevent-submit-default="preventSubmitDefault"
@change="changeHandler" @change="changeHandler"
></Form> ></Form>
<slot></slot> <slot></slot>
@ -58,6 +59,7 @@ const props = withDefaults(
confirmText?: string; confirmText?: string;
inline?: boolean; inline?: boolean;
labelPosition?: string; labelPosition?: string;
preventSubmitDefault?: boolean;
}>(), }>(),
{ {
config: () => [], config: () => [],

View File

@ -27,6 +27,7 @@
:label-width="labelWidth" :label-width="labelWidth"
:label-position="labelPosition" :label-position="labelPosition"
:inline="inline" :inline="inline"
:prevent-submit-default="preventSubmitDefault"
@change="changeHandler" @change="changeHandler"
></Form> ></Form>
<slot></slot> <slot></slot>
@ -85,6 +86,7 @@ const props = withDefaults(
zIndex?: number; zIndex?: number;
size?: 'small' | 'default' | 'large'; size?: 'small' | 'default' | 'large';
confirmText?: string; confirmText?: string;
preventSubmitDefault?: boolean;
}>(), }>(),
{ {
config: () => [], config: () => [],

View File

@ -27,6 +27,7 @@
:label-width="labelWidth" :label-width="labelWidth"
:label-position="labelPosition" :label-position="labelPosition"
:inline="inline" :inline="inline"
:prevent-submit-default="preventSubmitDefault"
@change="changeHandler" @change="changeHandler"
></Form> ></Form>
<slot></slot> <slot></slot>
@ -79,6 +80,7 @@ withDefaults(
confirmText?: string; confirmText?: string;
inline?: boolean; inline?: boolean;
labelPosition?: string; labelPosition?: string;
preventSubmitDefault?: boolean;
/** 关闭前的回调,会暂停 Drawer 的关闭; done 是个 function type 接受一个 boolean 参数, 执行 done 使用 true 参数或不提供参数将会终止关闭 */ /** 关闭前的回调,会暂停 Drawer 的关闭; done 是个 function type 接受一个 boolean 参数, 执行 done 使用 true 参数或不提供参数将会终止关闭 */
beforeClose?: (done: (cancel?: boolean) => void) => void; beforeClose?: (done: (cancel?: boolean) => void) => void;
}>(), }>(),