React PropTypes: permite diferentes tipos de PropTypes para un accesorio

244

Tengo un componente que recibe un accesorio por su tamaño. El accesorio puede ser una cadena o un número, por ejemplo: "LARGE"o 17.

¿Puedo dejar que React.PropTypes sepa que esto puede ser uno u otro en la validación de propTypes?

Si no especifico el tipo, recibo una advertencia: prop type `size` is invalid; it must be a function, usually from React.PropTypes.

MyComponent.propTypes = {
    size: React.PropTypes
}

reactjs react-proptypes

— Kevin Amiranoff
fuente

572

size: PropTypes.oneOfType([
  PropTypes.string,
  PropTypes.number
]),

Más información: Verificación de tipos con PropTypes

— Paweł Andruszków
fuente

Gracias por esto, obtengo errores aleatorios cuando ejecuto mis pruebas de Jest configurando Proptypes estáticos en mis clases: ReferenceError: oneOfType is not defined- ¿ Alguna sugerencia? ¡¡Gracias por adelantado!!

— Sara Inés Calderón

¿estás seguro de haber importado correctamente import PropTypes from 'prop-types';?

— Paweł Andruszków

Hola Pawel - sí, así es como los importamos:import PropTypes from 'prop-types';

— Sara Inés Calderón

1

2019 - use PropTypes.oneOf

— Imdad

26

Para fines de documentación, es mejor enumerar los valores de cadena que son legales:

size: PropTypes.oneOfType([
    PropTypes.number,
    PropTypes.oneOf([ 'SMALL', 'LARGE' ]),
]),

— cleong
fuente

11

Esto podría funcionar para usted:

height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),

— CorrinaB
fuente

1

Si bien este código puede responder la pregunta, proporcionar un contexto adicional con respecto a por qué y / o cómo responde la pregunta mejora su valor a largo plazo.

— rollstuhlfahrer

-4

import React from 'react';              <--as normal
import PropTypes from 'prop-types';     <--add this as a second line

    App.propTypes = {
        monkey: PropTypes.string,           <--omit "React."
        cat: PropTypes.number.isRequired    <--omit "React."
    };

    Wrong:  React.PropTypes.string
    Right:  PropTypes.string

— Miguel
fuente

16

Sí, PropTypes vive en su propio paquete ahora, pero eso no responde la pregunta ...

— Kevin Amiranoff

1

Completamente no relevante para la pregunta

— jalooc