When I tried to prepare my POST request body, I encountered a simple TypeError.
This is my handleSubmit function:
const handleSubmit = (values: any, formikHelpers: FormikHelpers<any>) => {
const prepareBody = { ...values.customerCase};
if (type === '1') {
console.log(prepareBody);
prepareBody.case.identity= {}; // 即使我删除这一行也会出错
prepareBody.case.identity.title =
values.customerCase.customer.contact.title;
prepareBody.case.identity.firstName =
values.customerCase.customer.contact.firstName;
prepareBody.case.identity.lastName =
values.customerCase.customer.contact.lastName ;
prepareBody.case.type = type;
}
PostCustomer({
reference: props.reference,
body: prepareBody,
})
.unwrap()
.then(() => {
formikHelpers.resetForm();
history.push('/success');
})
.catch(() => alertToasts('error', t('toast.error')));
};
I saw many similar questions but didn't find the correct answer. Do you have any ideas? Thanks
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Maybe you should declare the prepareBody object differently?
const prepareBody ={ case: { identity: { title: null, firstName: null, lastName: null }, type: null }, ...values.customerCase}
And don't forget to check the properties in the object:
Or use destructuring:
const { customerCase: { customer: { contact: { title, firstName, lastName } } }} = values || {};
The form values you get from the
formiklibrary are non-extensible. When you doconst prepareBody = { ...values.customerCase};you create an object that contains a copy of all original values, but for non-original values (such as object) is added, that's why you can't extend it.To be able to modify it, you need to create a deep copy of
values.customerCase. Now, the Javascript standard provides the structuredClone method to help you achieve this.