(JS) FormData로 submit 다루기

기본적인 활용법

const submitHandle = (e) => {
  e.preventDefault();
  const formData = new FormData(e.target);
  const formDataObj = Object.fromEntries(myFormData.entries());

  console.log(formDataObj);
};

checkbox 같이 여러 값이 있는 경우가 있습니다.
그럴 경우 FormData.getAll()를 활용하여 값을 덮어씌워줘야 합니다.

const submitHandle = (e) => {
  e.preventDefault();
  const formData = new FormData(e.target);
  const formDataObj = Object.fromEntries(myFormData.entries());
  formDataObj.checkboxList = formData.getAll('checkboxList');

  console.log(formDataObj);
};

폐기된 함수들...

const submitHandle = (e) => {
  e.preventDefault();
  const formData = new FormData(e.target);
  const formDataObj = Array.from(formData.keys()).reduce((ac, key) => {
    const dataList = formData.getAll(key);
    ac[key] = dataList.length > 1 ? dataList : dataList[0];
    return { ...ac };
  }, {});

  console.log(formDataObj);
};