mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-02 12:08:13 +08:00
feat: 表单扩充 inheritData 配置支持不需要隐藏域或者显式映射就能发送所有上层数据的场景了 (#3866)
This commit is contained in:
liaoxuezhi
GitHub
parent
e93fce39f2
commit
9de1be13b8
@ -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 | - | 重新加载 |
|
||||
|
||||
@ -626,7 +626,8 @@ export default class Form extends React.Component<FormProps, object> {
|
||||
}
|
||||
|
||||
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<FormProps, object> {
|
||||
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<FormProps, object> {
|
||||
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<FormProps, object> {
|
||||
fn,
|
||||
this.hooks['validate'] || [],
|
||||
__(messages && messages.validateFailed),
|
||||
validateErrCb,
|
||||
validateErrCb
|
||||
);
|
||||
}
|
||||
|
||||
@ -859,7 +865,7 @@ export default class Form extends React.Component<FormProps, object> {
|
||||
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<FormProps, object> {
|
||||
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<FormProps, object> {
|
||||
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<FormProps, object> {
|
||||
);
|
||||
},
|
||||
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<FormProps, object> {
|
||||
type: 'form',
|
||||
storeType: FormStore.name,
|
||||
isolateScope: true,
|
||||
storeExtendsData: (props: any) => props.inheritData,
|
||||
shouldSyncSuperStore: (store, props, prevProps) => {
|
||||
// 如果是 QuickEdit，让 store 同步 __super 数据。
|
||||
if (
|
||||
|
||||
Loading…
Reference in New Issue
Block a user