TypeScript: how to send array as a prop?

Question

I am sending an array of data to a component as a prop, like:

<InfoTable TableInfo={tableRows} />;

Where tableRows is the array.

On my InfoTable component file I define my props like

interface InfoTableProps {
  tableInfo: TableInfo[];
}

Which allows me to .map() through the tableInfo array, eg:

let tableRow = tableInfo.map(function(tableInfoRow) {
  // Do some stuff
}

This works fine. However, my compiler gets a warning on tableInfo: TableInfo[];

Cannot find name 'TableInfo'. TS2304

I've tried Googling the problem of course but I just get people asking the same question.

Would anyone know how to remove this error or what it means?

And it looks like you've named the prop as tableInfo but you're passing TableInfo={}, so maybe it's just a typo? — Emile Bergeron
– Emile Bergeron, Commented May 27, 2020 at 2:00

yen · Accepted Answer · 2020-05-27 01:40:08Z

1

Don't you need to define the TableInfo type somewhere?

eg

Interface TableInfo {
  id: number
  name: string
}

Sorry If you've already done that and its something else :-)

answered May 27, 2020 at 1:40

yen

2,4224 gold badges27 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

MeltingDog Over a year ago

So I need to declare each key in the array as well?

yen Over a year ago

yes. rn typescript doesn't know the structure of each item in your array. When you write TableInfo[], you're saying "an array of TableInfo-shaped things". Typescript wants to know what each of those things looks like.

yen Over a year ago

that'll be due to the typo that Emile mentioned above :)

Collectives™ on Stack Overflow

TypeScript: how to send array as a prop?

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related