如何让flow理解cloneelement将接收所需的道具的组件?

我有一个组件可以设置 required 所有财产 children ,但flow似乎并不理解它。

// @flow
import * as React from 'react';

type BarProps = { required: 'defined' };
const Bar = ({ required }: BarProps) => <span />

type FooProps = { children: Array<React.Element<any>> };
const Foo = ({ children }: FooProps) =>
    React.Children.map(
      children,
      child => React.cloneElement(child, { required: 'defined' })
    );

<Foo children={[<Bar />]} />

这里是 Flow repro ,返回的错误为:

14: <Foo children={[<Bar />]} />
                     ^ Cannot create `Bar` element because property `required` is missing in props [1] but exists in `BarProps` [2].
References:
14: <Foo children={[<Bar />]} />
                    ^ [1]
5: const Bar = ({ required }: BarProps) => <span />
                              ^ [2]

我知道设计不是最好的,我应该使用渲染道具可能,但这是一些旧的代码,我试图修复,我不能改变api那么容易。

如何使flow理解此代码?