时间戳

首页 > 解决方案 > 带有打字稿的反应材料表显示通用类型错误

reactjs - 带有打字稿的反应材料表显示通用类型错误

问题描述

我正在尝试在 Typescript 项目下运行react-material 。

由于我是 Typescript 的新手，我遇到了一些错误，我不知道如何解决它们。

在这个客人中，我正在尝试创建一个可重用的 React 组件。（请打开客人查看完整代码）

正如我所说，上面的示例显示了一些错误，这是 homePage 第 48 行中的示例：

No overload matches this call.
  Overload 1 of 2, '(props: Readonly<MaterialTableProps<IData>>): KTable<IData>', gave the following error.
    Type '{ title: string; field: string; type: string; }[]' is not assignable to type 'Column<IData>[]'.
      Type '{ title: string; field: string; type: string; }' is not assignable to type 'Column<IData>'.
        Types of property 'type' are incompatible.
          Type 'string' is not assignable to type '"string" | "boolean" | "time" | "numeric" | "date" | "datetime" | "currency" | undefined'.
  Overload 2 of 2, '(props: MaterialTableProps<IData>, context?: any): KTable<IData>', gave the following error.
    Type '{ title: string; field: string; type: string; }[]' is not assignable to type 'Column<IData>[]'.ts(2769)

为什么这个数组显示错误？

columns = [...{
    title: "Birth Place",
    field: "birthCity",
    type: "string" // ERROR ?!
}]

尽管接口明确定义了类型接受字符串：

type?: ('string' | 'boolean' | 'numeric' | 'date' | 'datetime' | 'time' | 'currency');

如果有人知道如何完成这项工作，那将会很有帮助。

标签： reactjstypescriptmaterial-uimaterial-table

解决方案

使用原始字符串值string将被解释为不是正确类型的字符串。为了解决这个问题，将其转换为const.

columns = [...{
    title: "Birth Place",
    field: "birthCity",
    type: "string" as const // ERROR ?!
}]

推荐阅读