Typescript: Property 'name' does not exist on type 'FormDataEntryValue'

Question

I have:

const file = formData.get('documents[]')

What type is file?

const file: FormDataEntryValue | null

I need to access to file?.name.

and i got:

Property 'name' does not exist on type 'FormDataEntryValue'.

Mort

If file is null, how do you expect to get the name property of it? Also, FormDataEntryValue is defined as either a string or a File. A string does not have a name property. – Waldner

Answer 1

FormDataEntryValue is defined as an union of File and string: type FormDataEntryValue = File | string;

Thus you need to check first that the variable is indeed a File:

if (file instanceof File) {
  console.log(file.name);
}

Psychotic

Where does type FormDataEntryValue come from? It's built in to TS? – Dr

Answer 2

FormData.get() returns a value of type string | File | null.

If you know that it is going to be a file, use:

const file = formData.get('documents[]') as File

Here is a reference, https://dev.to/deciduously/formdata-in-typescript-24cl

Amherst

Answer 3

I've got the similar issue for string property 'toUpperCase' does not exist on type 'FormDataEntryValue'. This is how I resolve my issue:

const name = (data.get("name") as string).toUpperCase();

So the explanation is that, data.get() returns FormDataEntryValue | null so I simply change/refer the type as string then apply the upper case function.

Terhune

Answer 4

Property 'name' does not exist on type 'FormDataEntryValue'.

As error says, looks like key passed in the FormData.get() or the name property in file variable doesn't exist.

The get() method of the FormData interface always returns the first value associated with a given key from within a FormData object.

Hence, As per your code. Looks like documents is an array of object. Hence, you can access the name by file[0]?.name instead of file?.name

formData.append('documents', '[{name: "alpha"}]');

const file = formData.get('documents')

const fileName = file[0]?.name // returns alpha

Valvate