react-puro-19
  • React Puro - 19
  • code
    • README
    • README
    • README
    • README
    • README
    • README
    • README
    • README
  • 7-state-en-clases
    • Ejemplo inicial: un contador
    • Manejo de eventos
    • El state
    • Sintaxis limpia en Class Components
    • setState es Asincrónico
    • Fusión superficial vs profunda
  • 5-children
    • Personalizar Children antes de renderizar
    • PropTypes para Children
    • Los Children
    • Diferentes tipos de Children
    • Manejando uso Children
  • 13-hook-usereducer
    • Qué es un Reducer?
    • Un ejemplo más practico
    • Entonces, Redux murió?
  • 4-proptypes
    • Documentación y depuración incluida
    • PropTypes como documentación
    • Cómo validar, formas comunes
    • Ejemplo Tweet con PropTypes
  • 3-props
    • Comunicación con componentes Padre
    • Las Props:
    • Pasar Props
    • Recibir Props
    • Ejemplo Tweet con Props
  • 11-pensando-uso-state
    • "Tipos" de componentes
    • Qué colocar en el State
    • Dónde mantener el estado
    • Pensando declarativamente
  • 9-requests-api
    • Intro
    • Eligir libreria HTTP
    • Obtener datos y mostrarlos
  • 10-state-en-funciones
    • El useState Hook
    • Actualizar State basado en State anterior
    • State como un Array
    • Reglas de los Hooks
    • La "magia" de los Hooks
    • State como un Objeto
    • Intro Hooks
  • 15-api-context
    • Usando React API Context
    • Patrón "Slots"
    • Patrón "Render Props"
    • Intro API Context
    • Otros Patrones de Context
    • Ejemplo perforación de props
    • hook_usecontext
  • 8-ciclo-vida-componente
    • Fases
    • El ciclo
    • Manejo de errores
    • Desmontaje
    • Representación
    • Montaje
  • 14-hook-useeffect
    • Límite cuando se ejecuta un Effect
    • Hacer cambios visibles del DOM
    • Obtener datos (Fetch) con useEffect
    • Intro useEffect
    • Re-obtener datos (Re-Fetch) cuando cambian
    • Solo ejecución en montaje y desmontaje
  • 2-jsx
    • Ejemplo componente Tweet:
    • JSX:
    • Trabajando con JSX:
  • 12-controles-entrada
    • Entradas controladas
    • Entradas no controladas
  • 6-github-file-list
    • Parte 2: la Prop 'key'
    • Parte inicial
  • 1-hola_mundo
    • Hola mundo:
Con tecnología de GitBook
En esta página

¿Te fue útil?

  1. 5-children

PropTypes para Children

Si se desea que el componente acepte cero, uno o más elementos secundarios, usar el validador .node:

propTypes : {
    children : PropTypes.node
}

Si se quiere que acepte un solo hijo, usar el validador .element:

propTypes : {
    children : PropTypes.element
}

Tener en cuenta que esto espera un solo elemento React como hijo. Esto significa que tiene que ser un componente personalizado o una etiqueta como < div >. PropTypes.element avisará si se pasa una cadena o número.

Si se necesita permitir un elemento o una cadena, se puede usar el validador de node (que aceptará elementos, cadenas y más) o ser más explícito con un validador oneOfType como este:

propTypes : {
    children : PropTypes.oneOfType([
        PropTypes.element,
        PropTypes.string
    ])
}

Al igual que con cualquier otro propType, son opcionales a menos que se agregue .isRequired.

AnteriorPersonalizar Children antes de renderizarSiguienteLos Children

Última actualización hace 5 años

¿Te fue útil?