reactjs - 如何一起使用 react-intl 和 typescript 中的 injectIntl​​？

Question

我正在尝试将 react-intl 中的 injectIntl​​ 与这样的 typescript 一起使用(这与我在其他问题的答案中发现的一致):

import { injectIntl, InjectedIntlProps } from "react-intl";

interface Props {
    certificate?: Certificate;
    onCancelClick(event: any): void;
    onDeleteClick(event: any): void;
    onSubmit(certificate: CertificateWritable): Promise<any>;
}

class CertificateForm extends Component<Props & InjectedIntlProps> {
// ... removed for simplicity
}

export default injectIntl<Props>(CertificateForm);

但我收到以下错误:

Error:(174, 34) TS2345: Argument of type 'typeof CertificateForm' is not assignable to parameter of type 'ComponentType<Props & InjectedIntlProps>'.
  Type 'typeof CertificateForm' is not assignable to type 'ComponentClass<Props & InjectedIntlProps, any>'.
    Types of property 'propTypes' are incompatible.
      Type '{ certificate: Requireable<InferProps<{ [x: string]: Requireable<string> | Validator<ReactText> | Requireable<boolean>; }>>; onCancelClick: Validator<(...args: any[]) => any>; onDeleteClick: Requireable<...>; onSubmit: Validator<...>; }' is not assignable to type 'WeakValidationMap<Props & InjectedIntlProps>'.
        Types of property 'certificate' are incompatible.
          Type 'Requireable<InferProps<{ [x: string]: Requireable<string> | Validator<ReactText> | Requireable<boolean>; }>>' is not assignable to type 'Validator<Certificate | null | undefined>'.
            Types of property '[nominalTypeHack]' are incompatible.
              Type 'InferProps<{ [x: string]: Requireable<string> | Validator<ReactText> | Requireable<boolean>; }> | null | undefined' is not assignable to type 'Certificate | null | undefined'.
                Type 'InferProps<{ [x: string]: Requireable<string> | Validator<ReactText> | Requireable<boolean>; }>' is not assignable to type 'Certificate | null | undefined'.
                  Type 'InferProps<{ [x: string]: Requireable<string> | Validator<ReactText> | Requireable<boolean>; }>' is missing the following properties from type 'Certificate': id, caCertificate, caCertificateKey, domain, and 2 more.

我不明白我做错了什么以及如何让它与 TS 一起工作？

此处建议的解决方案均无效:React-intl, use api with Typescript

我已经安装了 @types/react-intl 版本 2.3.17。

更新:这是我从 Props 中删除 certificate 时收到的错误消息:

Error:(175, 27) TS2345: Argument of type 'typeof CertificateForm' is not assignable to parameter of type 'ComponentType<Props & InjectedIntlProps>'.
  Type 'typeof CertificateForm' is not assignable to type 'ComponentClass<Props & InjectedIntlProps, any>'.
    Types of property 'propTypes' are incompatible.
      Type '{ certificate: Requireable<InferProps<{ [x: string]: Requireable<string> | Validator<ReactText> | Requireable<boolean>; }>>; onCancelClick: Validator<(...args: any[]) => any>; onDeleteClick: Requireable<...>; onSubmit: Validator<...>; }' is not assignable to type 'WeakValidationMap<Props & InjectedIntlProps>'.
        Types of property 'onDeleteClick' are incompatible.
          Type 'Requireable<(...args: any[]) => any>' is not assignable to type 'Validator<(event: any) => void>'.
            Types of property '[nominalTypeHack]' are incompatible.
              Type '((...args: any[]) => any) | null | undefined' is not assignable to type '((event: any) => void) | undefined'.
                Type 'null' is not assignable to type '((event: any) => void) | undefined'.

TypeScript 版本为 3.3.3333

Answer 1

看来，问题不在于react-intl。certificate 属性类型不正确的问题。查看 Certificate 类型。

只需从 props 中删除 certificate 并检查问题是否消失。