From 9de1be13b82478030f5d3e90179d5c8337b52681 Mon Sep 17 00:00:00 2001 From: liaoxuezhi <2betop.cn@gmail.com> Date: Mon, 28 Mar 2022 10:21:10 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E8=A1=A8=E5=8D=95=E6=89=A9=E5=85=85=20?= =?UTF-8?q?inheritData=20=E9=85=8D=E7=BD=AE=E6=94=AF=E6=8C=81=E4=B8=8D?= =?UTF-8?q?=E9=9C=80=E8=A6=81=E9=9A=90=E8=97=8F=E5=9F=9F=E6=88=96=E8=80=85?= =?UTF-8?q?=E6=98=BE=E5=BC=8F=E6=98=A0=E5=B0=84=E5=B0=B1=E8=83=BD=E5=8F=91?= =?UTF-8?q?=E9=80=81=E6=89=80=E6=9C=89=E4=B8=8A=E5=B1=82=E6=95=B0=E6=8D=AE?= =?UTF-8?q?=E7=9A=84=E5=9C=BA=E6=99=AF=E4=BA=86=20(#3866)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/zh-CN/components/form/index.md | 37 ++++++++++---------- src/renderers/Form/index.tsx | 53 ++++++++++++++++++++--------- 2 files changed, 55 insertions(+), 35 deletions(-) diff --git a/docs/zh-CN/components/form/index.md b/docs/zh-CN/components/form/index.md index b6814c465..e8c62bd19 100755 --- a/docs/zh-CN/components/form/index.md +++ b/docs/zh-CN/components/form/index.md @@ -1176,28 +1176,27 @@ Form 支持轮询初始化接口，步骤如下： | trimValues | `boolean` | `false` | trim 当前表单项的每一个值 | | promptPageLeave | `boolean` | `false` | form 还没保存，即将离开页面前是否弹框确认。 | | columnCount | `number` | 0 | 表单项显示为几列 | +| inheritData | `booelan` | `true` | 默认表单是采用数据链的形式创建个自己的数据域，表单提交的时候只会发送自己这个数据域的数据，如果希望共用上层数据域可以设置这个属性为 false，这样上层数据域的数据不需要在表单中用隐藏域或者显式映射才能发送了。 | ## 事件表 -| 事件名称 | 事件参数 | 说明 | -|-------------------|------------------------------------------------|----------------------| -| inited | `formData: object` 表单值 | 初始化完成 | -| change | `formData: object` 表单值 | 值变化 | -| formItemValidateSucc | - | 表单项校验成功 | -| formItemValidateError | - | 表单项校验失败 | -| validateSucc | - | 表单校验成功 | -| validateError | - | 表单校验成功 | -| submitSucc | `result: object` 接口返回内容 | 提交成功 | -| submitFail | `error: object` 接口返回内容 | 提交失败 | - - +| 事件名称 | 事件参数 | 说明 | +| --------------------- | ----------------------------- | -------------- | +| inited | `formData: object` 表单值 | 初始化完成 | +| change | `formData: object` 表单值 | 值变化 | +| formItemValidateSucc | - | 表单项校验成功 | +| formItemValidateError | - | 表单项校验失败 | +| validateSucc | - | 表单校验成功 | +| validateError | - | 表单校验成功 | +| submitSucc | `result: object` 接口返回内容 | 提交成功 | +| submitFail | `error: object` 接口返回内容 | 提交失败 | ## 动作表 -| 动作名称 | 动作配置 | 说明 | -|-------------------|-------------------------|------------------------| -| submit | - | 提交表单 | -| reset | - | 重置表单 | -| clear | - | 清空表单 | -| validate | - | 校验表单 | -| reload | - | 重新加载 | +| 动作名称 | 动作配置 | 说明 | +| -------- | -------- | -------- | +| submit | - | 提交表单 | +| reset | - | 重置表单 | +| clear | - | 清空表单 | +| validate | - | 校验表单 | +| reload | - | 重新加载 | diff --git a/src/renderers/Form/index.tsx b/src/renderers/Form/index.tsx index 57a0665e6..41290d00a 100644 --- a/src/renderers/Form/index.tsx +++ b/src/renderers/Form/index.tsx @@ -626,7 +626,8 @@ export default class Form extends React.Component { } async onInit() { - const {onInit, store, persistData, submitOnInit, dispatchEvent} = this.props; + const {onInit, store, persistData, submitOnInit, dispatchEvent} = + this.props; if (!isAlive(store)) { return; } @@ -659,7 +660,10 @@ export default class Form extends React.Component { persistData && store.getLocalPersistData(); // 派发init事件，参数为初始化数据 - const dispatcher = dispatchEvent('inited', createObject(this.props.data, {formData: data})); + const dispatcher = dispatchEvent( + 'inited', + createObject(this.props.data, {formData: data}) + ); if (!dispatcher?.prevented) { onInit && onInit(data, this.props); } @@ -754,14 +758,16 @@ export default class Form extends React.Component { const {store, dispatchEvent, data} = this.props; this.flush(); - return store.validate(this.hooks['validate'] || [], forceValidate).then((result: boolean) => { - if (result) { - dispatchEvent('validateSucc', data); - } else { - dispatchEvent('validateFail', data); - } - return result; - }); + return store + .validate(this.hooks['validate'] || [], forceValidate) + .then((result: boolean) => { + if (result) { + dispatchEvent('validateSucc', data); + } else { + dispatchEvent('validateFail', data); + } + return result; + }); } clearErrors() { @@ -792,7 +798,7 @@ export default class Form extends React.Component { fn, this.hooks['validate'] || [], __(messages && messages.validateFailed), - validateErrCb, + validateErrCb ); } @@ -859,7 +865,7 @@ export default class Form extends React.Component { formItemDispatchEvent(dispatchEvent: any) { return (type: string, data: any) => { dispatchEvent(type, data); - } + }; } emitChange(submit: boolean) { @@ -868,9 +874,17 @@ export default class Form extends React.Component { if (!isAlive(store)) { return; } - const dispatcher = dispatchEvent('change', createObject(data, {formData: store.data})); + const dispatcher = dispatchEvent( + 'change', + createObject(data, {formData: store.data}) + ); if (!dispatcher?.prevented) { - onChange && onChange(store.data, difference(store.data, store.pristine), this.props); + onChange && + onChange( + store.data, + difference(store.data, store.pristine), + this.props + ); } store.clearRestError(); @@ -1026,7 +1040,10 @@ export default class Form extends React.Component { errorMessage: saveFailed, onSuccess: (result: Payload) => { // result为提交接口返回的内容 - dispatchEvent('submitSucc', createObject(this.props.data, {result})); + dispatchEvent( + 'submitSucc', + createObject(this.props.data, {result}) + ); if ( !isEffectiveApi(finnalAsyncApi, store.data) || store.data[finishedField || 'finished'] @@ -1041,7 +1058,10 @@ export default class Form extends React.Component { ); }, onFailed: (result: Payload) => { - dispatchEvent('submitFail', createObject(this.props.data, {error: result})); + dispatchEvent( + 'submitFail', + createObject(this.props.data, {error: result}) + ); } }) .then(async response => { @@ -1634,6 +1654,7 @@ export default class Form extends React.Component { type: 'form', storeType: FormStore.name, isolateScope: true, + storeExtendsData: (props: any) => props.inheritData, shouldSyncSuperStore: (store, props, prevProps) => { // 如果是 QuickEdit，让 store 同步 __super 数据。 if (