PrimeReact FileUpload with Django and axios with redux

Question

我有这样的PrimeRreactFileUpload组件。FileUpload组件在Formik内

<FileUpload
mode="basic"
name="baptism_certificate"
accept="image/*"
maxFileSize={1000000}
customUpload
uploadHandler={onBasicUploadAuto}
chooseLabel="Browse"
/>

这是我的onBasicUploadAuto方法

const onBasicUploadAuto = ({ files }) => {
const [file] = files;
console.log(file);
const fileReader = new FileReader();
fileReader.onload = (e) => {
dispatch(uploadParishionerBaptismCertificate(parishioner.id, e.target.result));
};
fileReader.readAsDataURL(file);
};

这是我的uploadParishionerBaptismCertificate方法

export const uploadParishionerBaptismCertificate = (id:string, baptism_certificate:any) => async (dispatch:(func:any)=>void) => {
dispatch(uploadParishionerBaptismCertificateStart());
try {
const formData = new FormData();
formData.append('baptism_certificate', baptism_certificate);
const path = `parishioners/${id}/upload-baptism-certificate/`;
const response = await axios.post(path, formData, {
headers: {
'Content-Type': 'multipart/form-data; boundary=----WebKitFormBoundary7MA4YWxkTrZu0gW'
}
});
console.log(response.data);
dispatch(uploadParishionerBaptismCertificateSuccess(response.data.baptism_certificate));
} catch (error) {
let customError = '';
Object.keys(error).forEach((key) => {
console.log(key, error[key]);
customError += `${key.toString()}: ${error[key].join(',').toString()}n`;
});
dispatch(editParishionerFail(customError));
}
};

当我上传图像时，我从django 得到了以下响应

baptism_certificate > ["The submitted data was not a file. Check the encoding type on the form."]

我做错了什么？如何使用PrimeReact FileUpload组件上传文件？

Answer 1

remove"name"接受"；并尝试从文件上传