CODEWITHSUNDEEP
javascriptreactjstypesflowtype
dontexist
dontexist

Reputation: 5642

What is the Flow equivalent of React.PropTypes.node?

What is the Flow equivalent of React.PropTypes.node (i.e., anything that can be rendered by React, if there is one? Do I have to create it myself as a union type?

In other words, what would replace ??? here?

type Props = {
  children: ???,
}

const UselessComponent
  : (props: Props) => React$Element<*>
  = ({ children }) => (
    <div>
      {children}
    </div>
  )

UselessComponent.propTypes = {
  children: React.PropTypes.node.isRequired,
}

Upvotes: 15

Views: 4636

Answers (2)

Derek Dahmer
Derek Dahmer

Reputation: 15485

For versions of flow >= 0.53, use the new type React.Node for props.children and anywhere you are expecting a renderable node.

The definition of React.Node can be roughly approximated with a React.ChildrenArray:

type Node = React.ChildrenArray<void | null | boolean | string |
number | React.Element<any>>;

There was a major rework of the react types in flow 0.53. Summary of the changes and instructions on how to migrate are in the release notes. The flow docs explain how to use in detail.

For example:

import type { Node } from 'react';

type Props = {
  input?: Node,
}

Upvotes: 9

Dor Weid
Dor Weid

Reputation: 454

It looks like it is still an issue here.

According to the discussion in that issue, what you should do until it is fixed:

type Props = {
  children?: React.Element<*>,
};

Upvotes: 10

Related Questions