Skip to content
Advertisement

Using Interfaces as an attribute in TypeScript React

I have a class called Tab which has three props:

  • num: string
  • desc: string
  • parts: Part[]

where Part has this code in Tab.tsx:

interface Part {
    desc: string,
    link: string
}

But when I create a Tab in Menu.tsx (the parent), I am unsure how to define the parts attribute.

<Tab num="1" desc="Description" parts=? />

How do I go about this?

Advertisement

Answer

parts is an Array of objects in the shape of { desc: string; link: string; }.

Pass it this way: [{ desc: "foo", link: "bar" }, { desc: "foo", link: "baz" }].

Example:

<Tab
 num="1"
 desc="Description"
 parts={[{ desc: "foo", link: "bar" }, { desc: "foo", link: "baz" }]}
/>
User contributions licensed under: CC BY-SA
10 People found this is helpful
Advertisement