antd Upload组件上传状态一直处于uploading

antd Upload组件上传状态一直处于uploading

对于受控模式，需要在 onChange 中始终 setState fileList，保证所有状态同步到 Upload 内

import { UploadFile, UploadProps } from 'antd/es/upload/interface';

...

const [fileList, setFileList] = useState<UploadFile[]>([]);

const uploadProps: UploadProps = {
    accept: '*',
    maxCount: 1,
    action: 'url',
    onChange(info: any) {
      if (info.file.status === 'done') {
        if (info.file.response.code === 201) {
          //form.setFieldsValue({ filePath: info.file.response.data.fullPath });
          console.log(info.file.name);
          setFileList(info.fileList);
          notification.success({ key: 'success', message: `上传成功！` });
        } else {
          notification.error({ key: 'error', message: `${info.file.name} 上传失败！` });
        }
      }
      if (info.file.status === 'error') {
        notification.error({ key: 'error', message: `${info.file.name} 上传失败！` });
      }
      //每次onChange都需要更新fileList
      setFileList(info.fileList);
    },
    fileList: fileList,
  };
}

const normFile = (e: any) => {
  if (Array.isArray(e)) {
    return e;
  }
  if (e.file.status === 'done') {
    return e.file.response.data.fullPath;
  }
  return e && e.fileList;
};
...

<Form.Item
    label="文件"
    name="filePath"
    valuePropName="file"
    getValueFromEvent={normFile}
  >
    <>
      <Upload
        name="file"
        {...uploadProps}
      >
        <Button icon={<UploadOutlined />}>上传文件</Button>
      </Upload>
    </>
</Form.Item>