@react.component and optional arguments with default values

[Alex]

Labeled optional arguments are handled differently in general functions and functions annotated with @react.component.

Playground

let fn = (~x: option<string>=Some("foo")) =>
  switch x {
  | Some(x) => x->React.string
  | None => React.null
  }

fn(~x=Some("bar"))->Console.log
fn(~x=None)->Console.log
fn()->Console.log

module RC1 = {
  @react.component
  let make = (~x: option<string>) =>
    switch x {
    | Some(x) => x->React.string
    | None => React.null
    }
}

module RC2 = {
  @react.component
  let make = (~x: option<string>="foo" /* it should be Some("foo") */) =>
    x->React.string
}

<RC1 x={Some("bar")} />->Console.log
<RC1 x={None} />->Console.log

<RC2 x="bar" />->Console.log
<RC2 x={None} />->Console.log // ← error: impossible to explicitly pass None

[Gabriel Nordeborn]

You can pass None explicitly by using a question mark:

<RC2 x=?{None} />->Console.log