时间戳

首页 > 解决方案 > 如何将 Flow 类型与 Ant Design 表单集成？

reactjs - 如何将 Flow 类型与 Ant Design 表单集成？

问题描述

我使用 Ant Design 的 Form 作为我的组件的包装器FormComponent。然而，这种包装否定了 Flow 的检查，即我总是将所需的道具传递给FormComponent.

    import { Form } from "antd"

    type Props = {|
      userID: string,
      form: Form,
    |};

    class FormComponent extends Component<Props> {
        ...
    }

    export default Form.create()(FormComponent);

通常，如果我在另一个文件中调用<FormComponent />而不传递任何道具，Flow 会抛出一个错误。但是，包装似乎Form.create()阻止了这种错误检查。我该如何取回它？我试过Form.create<Props>()(FormComponent)了，没有用。

标签： reactjsflowtypeantd

解决方案

我正在这样做，它有点工作：

import type { FormProps } from 'antd';
import { Form } from 'antd';

type OwnProps = {|
  userID: string,
|};

type Props = OwnProps & FormProps;

class FormComponent extends Component<Props> {
  ...
}

export default Form.create()(FormComponent);

唯一让我抓狂的是formprop 是可选的FormProps，flow 想让我typeof this.props.form !== 'undefined'在访问类似validateFields().

有没有人找到比这个更好的解决方案？

推荐阅读