прикрепить файл к телу сообщения используя axios

Question

Я публикую форму с несколькими полями, но у меня возникают проблемы с получением вложенного файла для публикации вместе со значениями из других элементов ввода.

Я использую <input type="file"> для разметки и использую это: https://code.lengstorf.com/get-form-values-as-json/ для преобразования значений моей формы в действительный JSON.

Я получаю значение ввода файла следующим образом: inputelement.files[0], который является записью в объекте с именем: data, который я повторяю ниже (получая и ключи, и значения)

вот мой соответствующий javascript:

// doesn't work
const fd = () => {
    let formData = new FormData();
    Object.entries(data).forEach(([key, val]) => {
       formData.append(key, val);
    });
    return formData;
}

OR

// also doesnt work
const fd = {
     transformRequest: [(data) => {
         let formData = new FormData();
         Object.entries(data).forEach(([key, val]) => {
             console.log(key, val);
             formData.append(key, val);
         });
         return JSON.stringify(data);
     }]
 }

const config = {
    headers: {
        'Content-Type': 'application/json; charset=utf-8',
        'Accept': 'application/json',
    }
}

return axios.post(url, fd, config)
.then((res)) => {
   // do stuff
}

Вот скриншот полезной нагрузки: хромая ссылка на изображение

Мой синтаксис неверен? Ища ответы на это, но не могу понять, как заставить это работать. не похоже, что это должно быть так сложно: (

Любая помощь / руководство будет потрясающим. Пару дней бился головой об стену, и у меня начинает болеть голова: o

Спасибо