如何将联合中的类型用作类型别名

Question

我有一个类型定义错误 - Type 'RowProp<RowType>' is not assignable to type 'RowProp<number>'. 使用以下代码。

export type RowType = number | string;

export interface RowProp<T> {
  id: string;
  row: T;
}

export interface TableData {
  id: string;
  template?: (e: RowProp<RowType>) => JSX.Element;
}

const templateA = (e: RowProp<number>) => <div></div>;

const data: TableData = {
  id: '1',
  template: templateA
}

我该如何解决这个问题。

Answer 1

我不确定您要完成什么，但您可能正在寻找 generics：

export interface TableData<T extends RowType> {
    id: string;
    template?: (e: RowProp<T>) => JSX.Element;
}

const data: TableData<number> = {
    id: '1',
    template: templateA
}

以上通过严格编译。 通过允许TableData接受泛型类型参数T ，我们现在可以指定模板的RowProp将包含的内容。

也就是说，上面邪猴的评论也解决了这个问题。