Skip to content

Ability to use return value of React.Children.map with React.Children.only #13355

@Saruto

Description

@Saruto

As stated in the docs and shown in #4410, the return value of React.Children.map is incompatible with the React.Children.only function, and will return with the error message:

Invariant Violation: Invariant Violation: React.Children.only expected to receive a single React element child.

if used.

This incompatibility causes some fairly annoying restrictions, however. From what I understand, this means that you can't edit the properties of a component's children at runtime if they contain any component that requires a single child. (eg. you can't dynamically set the disabled prop of a child TouchableNativeFeedback component in the parent).

I believe this is due to the type differences between the this.props.children parameter and the React.Children.map return value, the former being a valid element and the latter not (see #4424 and reactjs/react.dev#87).

I'd like to make a request to have the return type of React.Children.map be the same as the type of this.props.children, which will fix these quirks and be much more intuitive. A separate static function that converts the return type of React.Children.map to the same type as this.props.children would also solve the issue. It feels like some sort of fix is in order, since it's a broad and strange restriction on the components you can use.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions