Logo de Código Facilito
  • Inicio
  • Replays
  • Iniciar sesión
  • Crear cuenta
  • Explorar cursos
  • Bootcamps
  • Precios
  • Blog

¡Califica el Curso Profesional de React (legado)!

Selecciona la calificación de 1 a 5 estrellas

Reporta un error

Curso Curso Profesional de React (legado)

Video Introducción a las props

Tipo de error

Algo salió mal al cargar el vídeo

El vídeo no pudo cargarse, hemos enviado un reporte al equipo de desarrollo, para poder solucionarlo a la brevedad.

Mientras solucionamos el problema, intenta lo siguiente para solucionar el error:

  • Recarga la página
  • Intenta reiniciar tu navegador y luego vuelve a reproducir el vídeo
  • Vacía el caché de tu navegador
  • Intenta reproducir con las extensiones del navegador deshabilitadas
  • Intenta con un navegador distinto
  • Si el problema persiste contáctanos en Discord
home Ir al inicio report_problem Reportar falla star Valorar curso

Como menciona la documentación de React:

Conceptualmente, los componentes son como las funciones de JavaScript. Aceptan datos de entrada (llamados props) y returnan elementos de React que describen lo que debería aparecer en la pantalla.

Las props son la colección de datos que un componente recibe del contenedor padre, y que pueden usarse para definir los elementos de React que retornará el componente.

En términos prácticos, si un componente necesita recibir información para funcionar, la recibe vía props.

En términos técnicos, las props tienen ciertas características:

  • Son inmutables, que es el adjetivo para lo que no se puede modificar o cambiar. Una prop no se modifica.
  • Pueden tener un valor por defecto
  • Pueden marcarse como obligatorias, cuando un componenente no puede funcionar sin recibir una prop.

En JSX, las props se ven como los atributos de los elementos HTML:

<Btn value=”Enviar” />

Estas props pueden recibir un string o el resultado de una expresión de JavaScript, usando la sintaxis de llaves:

<Saludo value={` Hola ${nombre} `} />

En componentes funcionales, las props se reciben como argumentos de la función. En clases se pueden leer vía la propiedad props del objeto:

const Btn = (props)=>{ return null; }

class Btn extends React.Component{
  render(){ console.log(this.props); return null; }
}

Continuemos aprendiendo sobre props en el siguiente tema, donde veremos valores por defecto.

  • check_circle_outline
    Módulo 1 | 4 clases

    Introducción

    expand_more
  • check_circle_outline
    Módulo 2 | 7 clases

    JSX - Templates

    expand_more
  • check_circle_outline
    Módulo 3 | 10 clases

    Componentes

    expand_more
    • done_all

      Clase 1

      Introducción a los componentes

    • done_all

      Clase 2

      Definiendo componentes

    • done_all

      Clase 3

      El render

    • done_all

      Clase 4

      Introducción a las props

    • done_all

      Clase 5

      Props en práctica

    • done_all

      Clase 6

      Qué es el state

    • done_all

      Clase 7

      Ejercicios con el state

    • done_all

      Clase 8

      Ciclo de vida de un componente

    • done_all

      Clase 9

      Eventos

    • done_all

      Clase 10

      Efectos secundarios

  • check_circle_outline
    Módulo 4 | 3 clases

    Formularios

    expand_more
  • check_circle_outline
    Módulo 5 | 4 clases

    Code splitting

    expand_more
  • check_circle_outline
    Módulo 6 | 4 clases

    React context

    expand_more
  • check_circle_outline
    Módulo 7 | 3 clases

    Cómo funciona React

    expand_more
  • check_circle_outline
    Módulo 8 | 7 clases

    Componentes de clase

    expand_more
  • check_circle_outline
    Módulo 9.-

    Examen del curso

    expand_more
    • done_all

      Examen

      Examen final del curso

Introducción a las props

arrow_back Siguiente arrow_forward
Curso Profesional de React (legado)