Netlify formData object from value

index.html

<form>
  <input type="text" name="cities[]" /> <!-- for arrays and objects. don't enumerate/propertize in markup. yes i just invented propertize -->
</form>

main.js

import toNetlifyFormData from './whatever'

let formData = toNetlifyFormData({
  cities: [{name: 'Chicago', state: 'IL', stuff: { population: 'many', religion: 'pastafarians' }}, {name: 'Los Angeles', state: 'CA'}]
})

let formData = toNetlifyFormData({
  cities: ['Chicago', 'Los Angeles']
})
// both will be valid

const response = await axios({
  method: 'post',
  url: '/',
  data: formData,
  config: {
    headers: { 'Content-Type': 'multipart/form-data; charset="utf-8"' },
  },
})

toNetlifyFormData.js

export default function toNetlifyFormData(value, formData = new FormData(), key = '') {
  if (value instanceof Array) {
    value.forEach((element, index) => {
      const tempFormKey = `${key}[]`
      toNetlifyFormData(element, formData, tempFormKey)
    })
  } else if (value instanceof Date) {
    formData.append(key, value.toISOString())
  } else if (
    typeof value === 'object' &&
    value !== null &&
    !(value instanceof File)
  ) {
    Object.keys(value).forEach(k =>
      toNetlifyFormData(value[k], formData, key ? `${key}[${k}]` : k)
    )
  } else {
    formData.append(
      key,
      typeof value === 'undefined' || value === null ? '' : value
    )
  }

  return formData
}

Great job! Does it work?

Works for me :)