通过来自 react-redux 的连接在 React 组件上传递 Typescript 泛型答案

【问题标题】：Passing Typescript generics on React component through connect from react-redux通过来自 react-redux 的连接在 React 组件上传递 Typescript 泛型
【发布时间】：2019-07-23 04:24:37
【问题描述】：

我正在尝试在通过 react-redux 的连接传递的组件中使用泛型。这是一个精简版：

export default class ItemBar<T> extends React.PureComponent{
  // ...
}

当我使用没有连接的 ItemBar 时，它看起来像这样：

export default class Component extends React.PureComponent {
   render() {
      return <ItemBar<number> />;
   }
}

这可以正常工作。当我这样“连接” ItemBar 类时：

class ItemBar<T> extends React.PureComponent {
  // ...
}

export default connect()(ItemBar);

我现在从 Typescript 获得 Expected 0 type arguments, but got 1.。我认为这是因为连接（可能还有其他更高的组件）没有通过泛型。有什么办法可以让它工作吗？

【问题讨论】：

export default connect()(ItemBar<T>); 如果将泛型传递给它会发生什么。
这给了我一个新错误 - Value of type 'typeof ItemBar' is not callable. Did you mean to include 'new'?

标签： reactjs typescript generics react-redux

【解决方案1】：

class ItemBar<T> extends React.PureComponent {
  // ...
}

const connected = connect()(ItemBar);

export class ItemBar<T> extends connected {}

如果每个文件有一个类规则，则可能必须在最后一行禁用 tslint。

【讨论】：