在 TypeScript React 中使用接口作为属性

Question

我有一个名为Tab 的类，它有三个道具：

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

Part 在Tab.tsx 中有此代码：

interface Part {
    desc: string,
    link: string
}

但是当我在Menu.tsx（父级）中创建Tab 时，我不确定如何定义parts 属性。

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

我该怎么做？

Answer 1

parts 是{ 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" }]}
/>