我必须处理application/json
和multiform/data
,student_image: fileState
,其中fileState
是e.target.file[0]
的值,这是图像和其他字段只有application/json
将存储,但这fileState
需要multiform/data
,即使在改变后,我的图像也没有存储在数据库中.当我的API接受List对象时,如何将数据发送到API.在DRF中存储图像和models.py
中的其他字段值有什么其他 idea 吗?
const handleSubmit = () => {
let dataToSend = {};
if (Array.isArray(formData)) {
// Handle array data
dataToSend = formData.map((formFields, index) => ({
// // Map the fields accordingly for each object in the array
// // Adjust this based on your data structure
sn: formFields.sn,
student_image: fileState,
// Add other fields as needed
}));
} else if (typeof formData === 'object') {
// dataToSend = [formData]
// Handle object data
dataToSend = [{
// Map the fields accordingly for the object
// Adjust this based on your data structure
nepali: formData.nepali,
international: formData.international,
graduate_school_or_campus: formData.Campus,
student_image: fileState,
first_name: formData.first_name,
middle_name: formData.middle_name,
last_name: formData.last_name,
email: formData.email,
contact_no: formData.contact_no,
gender: formData.gender,
blood_group: formData.blood_group,
ethnicity: formData.ethnicity,
religion: formData.religion,
date_of_birth_bs: formData.date_of_birth_bs,
date_of_birth_ad: formData.date_of_birth_ad,
batch: formData.batch,
disability_status: formData.disability_status,
sponsorship_status: formData.sponsorship_status,
rural_district: formData.rural_district,
martyr_lineage: formData.martyr_lineage,
// citizenship_no: citizenship_no,
// citizenship_image: formData.citizenship_image,
school: formData.school,
level: formData.level,
program: formData.program,
semester: formData.semester,
status: formData.status,
//
father_name: formData.father_name,
mother_name: formData.mother_name,
father_phone: formData.father_phone,
mother_phone: formData.mother_phone,
father_email: formData.father_email,
mother_email: formData.mother_email,
father_profession: formData.father_profession,
mother_profession: formData.mother_profession,
emergency_contact_name: formData.emergency_contact_name,
emergency_contact_phone: formData.emergency_contact_phone,
address: formData.address,
relation_with_student: formData.relation_with_student,
permanent_province: formData.permanent_province,
permanent_district: formData.permanent_district,
permanent_palika: formData.permanent_palika,
permanent_ward_no: formData.permanent_ward_no,
permanent_street_name: formData.permanent_street_name,
permanent_house_no: formData.permanent_house_no,
present_province: formData.present_province,
present_district: formData.present_district,
present_palika: formData.present_palika,
present_ward_no: formData.present_ward_no,
present_street_name: formData.present_street_name,
present_house_no: formData.present_house_no,
remarks: formData.remarks,
education_history: formData.nestedForms,
awardsMeritsScholarship: formData.nestedForms2
// Add other fields as needed
}];
}
console.log('this is actual data', dataToSend);
console.log('Type of dataToSend:', typeof dataToSend);
// Now you can send a POST request with dataToSend to your APIw
// For example using Axios or fetch
// Replace 'YOUR_API_URL' with the actual API endpoint
// Replace 'YOUR_ACCESS_TOKEN' with any authorization token you might need
console.log("this is final data to sent", dataToSend)
fetch(`${URL}`, {
method: 'POST',
headers: {
// 'Content-Type': 'multipart/form-data; boundary=----WebKitFormBoundary7MA4YWxkTrZu0gW', // Adjust the content type
'Content-Type': 'application/json', // Adjust the content type
'Authorization': `Bearer${Ttoken.access}`
},
body: JSON.stringify(dataToSend),
})
.then(response => response.json())
.then(data => {
console.log('Response from API:', data);
// Additional logic after receiving a response from the API
})
.catch(error => {
console.error('Error:', error);
// Handle errors from the API call
});
};