fix: unable to submit form during file upload (#892)
(cherry picked from commit 54d23e33534cf3656a8a57d57bde018801c5b43b)
This commit is contained in:
parent
d5d3e4fb96
commit
9d947a0fa5
@ -1,5 +1,5 @@
|
|||||||
import { css } from '@emotion/css';
|
import { css } from '@emotion/css';
|
||||||
import { observer, RecursionField, useField, useFieldSchema } from '@formily/react';
|
import { observer, RecursionField, useField, useFieldSchema, useForm } from '@formily/react';
|
||||||
import { Button, Modal, Popover } from 'antd';
|
import { Button, Modal, Popover } from 'antd';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
@ -87,6 +87,7 @@ export const Action: ComposedAction = observer((props: any) => {
|
|||||||
const { run } = useAction();
|
const { run } = useAction();
|
||||||
const fieldSchema = useFieldSchema();
|
const fieldSchema = useFieldSchema();
|
||||||
const compile = useCompile();
|
const compile = useCompile();
|
||||||
|
const form = useForm();
|
||||||
const designerProps = fieldSchema['x-designer-props'];
|
const designerProps = fieldSchema['x-designer-props'];
|
||||||
const openMode = fieldSchema?.['x-component-props']?.['openMode'];
|
const openMode = fieldSchema?.['x-component-props']?.['openMode'];
|
||||||
const renderButton = () => (
|
const renderButton = () => (
|
||||||
@ -94,6 +95,7 @@ export const Action: ComposedAction = observer((props: any) => {
|
|||||||
{...others}
|
{...others}
|
||||||
loading={field?.data?.loading}
|
loading={field?.data?.loading}
|
||||||
icon={<Icon type={icon} />}
|
icon={<Icon type={icon} />}
|
||||||
|
disabled={form.disabled}
|
||||||
onClick={(e: React.MouseEvent) => {
|
onClick={(e: React.MouseEvent) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { Field } from '@formily/core';
|
import { Field } from '@formily/core';
|
||||||
import { useField } from '@formily/react';
|
import { useField, useForm } from '@formily/react';
|
||||||
import { reaction } from '@formily/reactive';
|
import { reaction } from '@formily/reactive';
|
||||||
import { isArr, isValid, toArr as toArray } from '@formily/shared';
|
import { isArr, isValid, toArr as toArray } from '@formily/shared';
|
||||||
import { UploadChangeParam } from 'antd/lib/upload';
|
import { UploadChangeParam } from 'antd/lib/upload';
|
||||||
@ -167,6 +167,8 @@ export function useUploadProps<T extends IUploadProps = UploadProps>({ serviceEr
|
|||||||
props.onChange?.(normalizeFileList([...param.fileList]));
|
props.onChange?.(normalizeFileList([...param.fileList]));
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const form = useForm();
|
||||||
|
|
||||||
const api = useAPIClient();
|
const api = useAPIClient();
|
||||||
|
|
||||||
return {
|
return {
|
||||||
@ -179,6 +181,7 @@ export function useUploadProps<T extends IUploadProps = UploadProps>({ serviceEr
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
formData.append(filename, file);
|
formData.append(filename, file);
|
||||||
|
form.disabled = true;
|
||||||
api.axios
|
api.axios
|
||||||
.post(action, formData, {
|
.post(action, formData, {
|
||||||
withCredentials,
|
withCredentials,
|
||||||
@ -190,7 +193,10 @@ export function useUploadProps<T extends IUploadProps = UploadProps>({ serviceEr
|
|||||||
.then(({ data }) => {
|
.then(({ data }) => {
|
||||||
onSuccess(data, file);
|
onSuccess(data, file);
|
||||||
})
|
})
|
||||||
.catch(onError);
|
.catch(onError)
|
||||||
|
.finally(() => {
|
||||||
|
form.disabled = false;
|
||||||
|
});
|
||||||
|
|
||||||
return {
|
return {
|
||||||
abort() {
|
abort() {
|
||||||
|
Loading…
Reference in New Issue
Block a user