reason-react

reason-react copied to clipboard

I'm quite new to ReasonReact. So, there's a good chance I've just missed something, but I've been trying to figure out how to pass an array of children to a component and haven't been able to figure it out. This is what I've made:

and this is the error I'm getting from it

What's even more confusing is that if I manually pass multiple children:

Everything is all good:

Is this intended behavior, and if so, how do I pass a generated array of children to a component?

Could you try to wrap your array of children in React.array, for example:

module Button = {
  @react.component
  let make = (~buyLinks: array<string>) => {
    <div>
      {React.array(Array.map(name => <a> {React.string(name)} </a>, buyLinks))}
    </div>
  }
}

(playground link)

Worked like a charm! Thank you. Also, just out of curiosity, is this documented somewhere? If not, I'd highly recommend adding a note about it since it's a very common use-case.

It is documented in new function components doc and old Record API doc.

It took me like a year to find out that React.array exists.

It's on the first section of the docs for "Core" @banacorn (https://reasonml.github.io/reason-react/docs/en/components)

Maybe we should have a separate section for this precise error?

I'm closing this, but might be able to fix this soon.