TS 属性在泛型定义的类型上不存在

Question

我有一个类型 Columns，其中包含用于呈现 table:

的信息

export type Columns = {
  header: React.ReactNode;
  cellContent: <T>(content: T, rowIndex: number) => React.ReactNode;
  ...
}

然后我在要呈现一些数据的组件中定义一个 Columns[] 数组。你可以在这里看到一个例子：

{
  header: 'Site name',
  cellContent: <Equipment,>(equipment: Equipment, rowIndex: number) => {
    return (
      <div className={styles.equipmentNameContainer}>{equipment.title}</div>
    );
  },
},

但是，我收到一个错误，指出属性 'title' 在类型 'Equipment' 上不存在，但它确实如您在此处看到的那样：

export type Equipment = {
  _entity: ResourceType.EQUIPMENT;
  id: number;
  title: string;
  ...
}

我注意到设备类型的导入在 VS Code 中是灰色的，事实上，如果我删除导入，我不会抱怨设备类型不存在，所以很明显我定义了错误并且以某种方式创建了一个'locally scoped type' 装备。

在制作我的列数组时，我需要做什么才能使内容参数通用并由 cellContent 键指定？

我试过谷歌搜索，但没有找到任何相关信息

编辑：此处可用的沙箱 (https://codesandbox.io/s/typescript-playground-export-ibhf7?fontsize=14&hidenavigation=1&theme=dark) 反映了下面的评论，但仍有问题

Answer 1

您可以通过以下方法解决此问题：

直接说TS T就是装备基地class。不是最好的选择，因为你失去了灵活性。

import { Equipment } from "./Equipment";

type Columns = {
  header: string;
  cellContent: <T extends Equipment>(content: T, rowIndex: number) => string;
};

const columns: Columns[] = [
  {
    header: "Site name",
    cellContent: (equipment: Equipment, rowIndex: number) => {
      return equipment.title;
    }
  }
];

将 T 作为泛型添加到 Type，这对我来说要好得多：

type Columns<T> = {
  header: string;
  cellContent: (content: T, rowIndex: number) => string;
};

const columns: Columns<Equipment>[] = [
  {
    header: "Site name",
    cellContent: (equipment: Equipment, rowIndex: number) => {
      return equipment.title;
    }
  }
];

TS 属性在泛型定义的类型上不存在

TS property doesn't exist on type defined by generic

typescript

typescript-generics

TS 属性 在泛型定义的类型上不存在

TS property doesn't exist on type defined by generic

typescript

typescript-generics

TS 属性在泛型定义的类型上不存在