如何与外部高阶组件包装器一起使用Flow

Question

Flow documentation仅显示如何声明自定义高阶组件以与自定义类及其道具一起使用。就我而言，我有一个自定义类，例如：

type Props = {
  navigation: Object,
  isFocused: boolean
}

type State = {
  config: AppConfig,
  pack: Package,
  init: boolean,
}

class MainAppScreen extends React.Component<Props, State> {
...
}
export default withNavigationFocus(MainAppScreen);

并且想通过'反应导航'将其与外部HOC封装在一起；

我应该怎么做（// $ FlowFixMe旁边）以摆脱此消息：

错误：（111，16）无法为此模块构建类型化的接口。您应该使用类型注释此模块的导出。无法确定此调用表达式的类型。请提供注释，例如，通过在此表达式周围添加类型转换。 （signature-verification-failure）

谢谢。

更新：@ user11307804指向正确的方向，这涉及外部库的流类型。但是，似乎仍然无法为（HOC）函数导入类型，例如：

declare export function withNavigation<Props: {...}, ComponentType: React$ComponentType<Props>>(
    Component: ComponentType
  ): React$ComponentType<
    $Diff<
      React$ElementConfig<ComponentType>,
      {| navigation: NavigationScreenProp<NavigationStateRoute> |}
    >
  >;

[当我尝试将其导入为following this example时：

import typeof {withNavigationFocus} from 'react-navigation';

我收到错误：

Error:(22, 14) Cannot import the value `withNavigationFocus` as a type. `import type` only works on type exports like type aliases, interfaces, and classes. If you intended to import the type of a value use `import typeof` instead.

并且如果我尝试使用typeof，我会得到：

import typeof {withNavigationFocus} from 'react-navigation';

我收到错误：

Error:(22, 16) Cannot declare  `withNavigationFocus` [1] because the name is already bound.
Error:(112, 16) Cannot call `withNavigationFocus` because  Named import from module `react-navigation` [1] is not a function.
Error:(112, 16) Cannot build a typed interface for this module. You should annotate the exports of this module with types. Cannot determine the type of this call expression. Please provide an annotation, e.g., by adding a type cast around this expression. (`signature-verification-failure`)

谢谢。

Answer 1

Flow抱怨withNavigationFocused没有输入。幸运的是，flow-typed项目具有react-navigation types。 （react-navigation或react-navigation的不同版本还有其他定义文件；我链接的文件是flow和react-navigation^4.0.0的文件。）您可以在flow^0.114.0之后在项目中包括库定义（本质上，只需将文件保存在Library Definitions documentation目录中即可。