为 HOC 编写流 libdef答案

【问题标题】：Writing a flow libdef for an HOC为 HOC 编写流 libdef
【发布时间】：2018-12-27 05:31:41
【问题描述】：

我正在为一个为我们提供 HOC 的库编写一个库定义。 HOC 的实现如下所示：

const withValidation = TargetComponent => class extends React.Component {
  onSubmit: () => { ... }
  getFormData: () => { ... }
  getErrors: () => { ... }
  setField: diff => { ... }
  resetState: () => { ... }
  render () { return <TargetComponent ... /> }
}

我想编写一个库定义，指定返回的组件从 HOC 具有上面列出的实例方法。由于该组件的工作方式，它是通过 ref 访问的，我希望这些组件出现在此处。

我已经尝试为返回的组件编写一个 libdef - 这是其中的相关部分：

declare class WithValidation<FormConfig> extends React$Component {
  onSubmit: () => boolean;
  getFormData: () => {
    [key: string]: string,
  };
  setField: (diff: {}) => void;
  getErrors: () => { [key: string]: string | null };
  resetState: () => void;
}

这给了我一些错误，表明我的包装组件是不是 React 组件。显然我在指定类的方式上做错了——但我不知道应该写什么。

任何帮助将不胜感激！

【问题讨论】：

标签： javascript reactjs flowtype static-typing flow-typed

【解决方案1】：

Flow 在 0.89.0 中实现了 React.AbstractComponent 以帮助编写 HOC。查看documentation for writing HOCs。

【讨论】：

嗨 - 欢迎来到 Stack Overflow！感谢您的建议！您能否详细说明您可以使用React.AbstractComponent 输入这种 HOC 吗？更详细的答案对于稍后提出这个问题的人会更有帮助:)