属性 ... 不存在于类型 'IntrinsicAttributes & ...'

Question

我将 .js 文件更改为打字稿文件 .tsx。我在文件中定义了以下函数：

function MyCard(param1: ObjectDto, toggleFunction: any) {}

我在另一个 .tsx 文件中使用这个函数

<MyCard param1={param1Value} toggleFunction={myToggleFunction} />

但我收到以下错误：

类型 '{ param1: ObjectDto; toggleFunction: (index: any) => void; }' 不可分配给类型 'IntrinsicAttributes & ObjectDto'。类型“IntrinsicAttributes & ObjectDto”上不存在属性“param1”。

在更改为 Typescript 格式之前，这很好用。我该如何为 Typescript 解决这个问题？

Answer 1

组件只有一个参数，即props对象，因此您的函数应如下所示：

function MyCard(props: { param1: ObjectDto, toggleFunction: any }) {}

类型系统试图将属性与函数的第一个参数匹配，该参数的类型为ObjectDto。这就是为什么你得到错误

不可分配到类型“IntrinsicAttributes & ObjectDto”

Answer 2

您是否为组件“MyCard”制作了接口？

像这样：

interface MyCodeParams {
    param1: ObjectDto
    toggleFunction: (param: any) => void
}

另外，我认为toggleFunction: (param?: any) => void这是正确的类型，因为您的函数可能有参数，所以您应该像这样输入您的函数。