Skip to content

The "children" API #14

Closed
Closed
@maddie927

Description

@maddie927

I was fixing up createElement_ and adding a keyed helper to stop all the warnings React emits when you use nested arrays as children and stumbled into, "But what if they specify children as props.children??".

Some background:

  1. The only thing that makes the "children" prop special is that the dom components (when the first arg to React.createElement is a string) use that prop to render child nodes.
  2. As a result, JSX has special syntax for children (things between the tags)..
  3. And React.createElement itself has a special case for any additional props after the first two: they get merged into the children prop

For example,

<div>
  {a}
  {b}
</div>

and

createElement("div", { children: [a, b] })

and

createElement("div", {}, a, b)

are all the same. This is different and produces the "key" warning:

createElement("div", {}, [a, b])

(^-- this is how it's currently done in purescript-react-basic)

Looking into this I stumbled onto this discussion: facebook/react#4694

All the reasons for supporting these slightly different APIs are related to JS and JSX convenience and backwards compatability. Since none of those things matter in purescript-react-basic (backwards compatibility does a bit, but it's still young and pre-stable release), I'm going to propose removing the 3rd "children" arg from all of the React.Basic.DOM components and adding children :: JSX to the prop records of the components which support children.

Thoughts?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions