Flowtype, React y defaultProps

Flowtype, React y defaultProps

Después de horas de búsquedas y pruebas, no logré encontrar ninguna solución para que el flujo entendiera las propiedades predeterminadas

See Try Flow example

Usar este modelo no es consistente:

type PropsType = {|
  size?: 'small' | 'big',
|};


class Letter extends PureComponent<PropsType> {

  static defaultProps = {
    size: 'small',
  }

}

Gracias

Editar

After Tomasz Mularczyk's suggestion, I created another Try Flow example with:

type PropsType = {|
  size: 'small' | 'big',
|};

en lugar de

type PropsType = {|
  size?: 'small' | 'big',
|};

Pero

defaultProp size ya no se escribe:

static defaultProps = {
  size: 'BAD DEFAULT PROPS', // no error (?!)
}

Solución

Ver la respuesta de Tomasz Mularczyk

+

No espere el error de flujo en su componente actual (en mi caso), sino dónde se importará y declarará (parece semiestático, ¿no?)

Mostrar la mejor respuesta

Simplemente elimine ? del tipo size. Flow verá automáticamente que creó defaultProps y no lo requerirá.

De docs:

Para escribir props predeterminados, agregue una propiedad estática defaultProps a su clase.

...

React también admite accesorios predeterminados en componentes funcionales sin estado. De manera similar a los componentes de clase, accesorios predeterminados para funciones sin estado los componentes funcionarán sin ningún tipo de anotación adicional.

Si elimino el ? de size PropsType, el static defaultProps se vuelve inútil, y esto generará una advertencia de proptypes en tiempo de ejecución porque el size prop ganó no se puede pasar

@MadeInMoon Flow puede "ver" que ha declarado una propiedad predeterminada para una propiedad requerida. Y no lo requerirá cuando use ese componente.

gracias por tu tiempo. Vea mi edición anterior con otro ejemplo de Try Flow

encontrado la solución: quitar el ? desde el tamaño PropsType + y no espere errores en el componente actual, ¡sino cuándo se importará y declarará!

@MadeInMoon gracias por compartir, no lo pensaría :)