feat(form): 容器组件新增 extendState 属性

FormBox、FormDialog、FormDrawer 新增 extendState 属性,并透传给内部 MForm,
方便外层注入 $message、$store 等扩展上下文到 formState。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
roymondchen 2026-05-21 14:58:43 +08:00
parent 05e512b1fe
commit 2d31b3812f
3 changed files with 11 additions and 3 deletions

View File

@ -13,6 +13,7 @@
:label-position="labelPosition"
:inline="inline"
:prevent-submit-default="preventSubmitDefault"
:extend-state="extendState"
@change="changeHandler"
></Form>
<slot></slot>
@ -40,7 +41,7 @@ import { computed, ref, watchEffect } from 'vue';
import { TMagicButton, TMagicScrollbar } from '@tmagic/design';
import Form from './Form.vue';
import type { ContainerChangeEventData, FormConfig, FormValue } from './schema';
import type { ContainerChangeEventData, FormConfig, FormState, FormValue } from './schema';
defineOptions({
name: 'MFormBox',
@ -60,6 +61,7 @@ const props = withDefaults(
inline?: boolean;
labelPosition?: string;
preventSubmitDefault?: boolean;
extendState?: (_state: FormState) => Record<string, any> | Promise<Record<string, any>>;
}>(),
{
config: () => [],

View File

@ -31,6 +31,7 @@
:label-position="labelPosition"
:inline="inline"
:prevent-submit-default="preventSubmitDefault"
:extend-state="extendState"
@change="changeHandler"
></Form>
<slot></slot>
@ -68,7 +69,7 @@ import { computed, ref } from 'vue';
import { TMagicButton, TMagicCol, TMagicDialog, TMagicRow } from '@tmagic/design';
import Form from './Form.vue';
import { ContainerChangeEventData, FormConfig, FormValue, StepConfig } from './schema';
import { ContainerChangeEventData, FormConfig, FormState, FormValue, StepConfig } from './schema';
defineOptions({
name: 'MFormDialog',
@ -95,6 +96,8 @@ const props = withDefaults(
destroyOnClose?: boolean;
showClose?: boolean;
showCancel?: boolean;
/** 透传给内部 `MForm`,用于扩展 `formState`(如注入 `$message` / `$store` 等) */
extendState?: (_state: FormState) => Record<string, any> | Promise<Record<string, any>>;
}>(),
{
config: () => [],

View File

@ -28,6 +28,7 @@
:label-position="labelPosition"
:inline="inline"
:prevent-submit-default="preventSubmitDefault"
:extend-state="extendState"
@change="changeHandler"
></Form>
<slot></slot>
@ -59,7 +60,7 @@ import { ref, watchEffect } from 'vue';
import { TMagicButton, TMagicCol, TMagicDrawer, TMagicRow } from '@tmagic/design';
import Form from './Form.vue';
import type { ContainerChangeEventData, FormConfig, FormValue } from './schema';
import type { ContainerChangeEventData, FormConfig, FormState, FormValue } from './schema';
defineOptions({
name: 'MFormDialog',
@ -83,6 +84,8 @@ withDefaults(
preventSubmitDefault?: boolean;
/** 关闭前的回调,会暂停 Drawer 的关闭; done 是个 function type 接受一个 boolean 参数, 执行 done 使用 true 参数或不提供参数将会终止关闭 */
beforeClose?: (_done: (_cancel?: boolean) => void) => void;
/** 透传给内部 `MForm`,用于扩展 `formState`(如注入 `$message` / `$store` 等) */
extendState?: (_state: FormState) => Record<string, any> | Promise<Record<string, any>>;
}>(),
{
closeOnPressEscape: true,