Formik send undefined PostId and UserId to Backend - reactjs

Question

I have a component with a Formik form for creating a new comment.
On the back, the comment needs PostId, UserId and text.
When I try to post, my console.logs on front return all the data, but I get an "error 400, Comment.UserId and Comment.PostId cannot be null" and the back receives all data undefined.
How it's possible?
If this data was undefined, all console.log should return undefined too, right?
CommentForm:
function newComment(values) {
const formData = new FormData();
formData.append("firstName", firstName);
formData.append("lastName", lastName);
formData.append("UserId", UserId);
formData.append("PostId", PostId);
formData.append("text", values.text);
console.log("UserId", UserId);
console.log("firstName", firstName);
console.log("lastName", lastName);
console.log("PostId", PostId);
console.log("text", values.text);
console.log(props.id);
axios({
method: "post",
url: `http://localhost:8000/api/comments/${props.id}`,
data: formData,
headers: {
"Content-Type": "multipart/form-data",
Authorization: `Bearer ${AuthState.token}`,
},
})
.then((res) => {
if (res.status === 201) {
console.log("Success");
window.location.reload(true);
}
})
.catch(function (error) {
console.log(error)
});
}
<Formik
initialValues={{ text: "" }}
onSubmit={(values) => {
if (!values.text) {
setErrorMessage("Need text");
} else {
newComment(values);
}
}}
>
<Form>
<div>
<Field
name="text"
type="contentarea"
placeholder="Text Comment"
/>
<ErrorMessage name="text" className="errorInput" />
</div>
<Button
type="submit"
title="Post comment"
aria-label="Comment"
>
Comment
</Button>
</Form>
</Formik>
Comment controller:
exports.createComment = async (req, res, next) => {
const postObject = req.body;
const UserId = req.body.UserId;
const PostId = req.body.PostId;
const firstName = req.body.firstName;
const lastName = req.body.lastName;
if (!req.body) return res.status(403).send("Veillez saisir un texte");
console.log(req.body);
console.log(UserId);
console.log(PostId);
console.log(firstName);
console.log(lastName);
const comment = new Comment({
text: req.body.text,
UserId: UserId,
PostId: PostId,
firstName: firstName,
lastName: lastName,
});
comment
.save()
.then(() => res.status(201).json({ message: "Commentaire posté" }))
.catch((error) => res.status(400).json({ error }));
};
My Back is working (tested with Postman) and I used formik for other components inside the project and it works.
I don't understand why it can't send the data in this case.