在 TypeScript React 中使用接口作為屬性

Question

我有一個名為Tab的 class ，它具有三個道具：

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

其中Part在Tab.tsx中有此代碼：

interface Part {
    desc: string,
    link: string
}

但是當我在Menu.tsx （父級）中創建一個Tab時，我不確定如何定義部件屬性。

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

我該如何 go 關於這個？

Answer 1

parts是一個對象數組，形狀為{ desc: string; link: string; } { desc: string; link: string; } { desc: string; link: string; } 。

以這種方式傳遞： [{ desc: "foo", link: "bar" }, { desc: "foo", link: "baz" }] 。

例子：

<Tab
 num="1"
 desc="Description"
 parts={[{ desc: "foo", link: "bar" }, { desc: "foo", link: "baz" }]}
/>