如何扩展 React 函数式组件 Prop 类型？

Question

我有一个完美运行的 React 功能组件，我正在为该组件使用打字稿。我想稍微扩展一下，这样我也可以在其他地方使用它，挑战是我使用了一种我不想更改的道具类型，但要扩展它，这是组件：

const CargoCard = (props: CargoGetListResultModel) => {
  ** Some Code here **
}

谁能帮我扩展道具类型？例如，我想添加两个新道具，例如

{isExtended: boolean; extendedData: {id: number, title: string}}

Answer 1

您可以使用交叉点类型

type ExtendedType = CargoGetListResultModel & {isExtended: boolean; extendedData: {id: number, title: string}};

// inline:

const CargoCard = (props: CargoGetListResultModel & {isExtended: boolean; extendedData: {id: number, title: string}}) => {
  // ** Some Code here **
}

查看 https://www.typescriptlang.org/docs/handbook/advanced-types.html 了解更多示例。

如何扩展 React 函数式组件 Prop 类型？

How Can I extend a React functional Component Prop Type?

typescript

reactjs

react-props