Este es un tutorial para principiantes sobre cómo usar accesorios. Es importante que comprenda qué es la desestructuración y cómo usar/crear componentes antes de leer.

Props, abreviatura de propiedades, los props nos permiten enviar información desde los componentes principales a los componentes secundarios; también es importante tener en cuenta que pueden ser de cualquier tipo de datos.

Es imperativo comprender la sintaxis para crear un accesorio para cualquiera de sus componentes. En React, debes usar la misma sintaxis para escribir un atributo para una etiqueta html. La forma en que especificamos un accesorio es colocándolo dentro de nuestro elemento de esta manera:

ParentPlant() {
  return  
}

Una buena regla para recordar al crear accesorios es: las cadenas no necesitan tener llaves alrededor de su valor, solo hacemos esto para otros tipos de datos. Como puede ver arriba, podemos tener una multitud de accesorios asignándolos al componente principal. Cuando tenemos nuestros accesorios dentro de nuestro componente, es importante saber que técnicamente los estamos transmitiendo . Una vez que transmitimos nuestros accesorios, debemos poder recibirlos dentro de nuestro componente deseado. En este caso nuestro componente ChildPlant.

Recibir accesorios:

function ChildPlant(props) {
  return (
    
      {props.text} {props.number}
    >
  )
}

Estamos haciendo las cosas aquí: 1. Estamos recibiendo nuestra propiedad dentro del parámetro de nuestro componente ChildPlant, 2. Estamos desestructurando los valores de nuestra propiedad a través del nombre de nuestra propiedad. Es importante saber que nuestros accesorios no son un parámetro, sino que funcionan de manera similar a uno.

La única forma de pasar datos del componente principal a su componente secundario es mediante accesorios. Me gusta pensar que es como el ADN: un componente principal contiene aspectos de sí mismo que ya existen en su interior. Debido a que ese niño también puede tener aspectos del ADN de sus padres, los accesorios funcionan como el activador que hace que el cabello de ese niño sea rojo, negro o rubio.

Los accesorios se reciben en la función secundaria y se envían a través de la función principal, pero los accesorios solo pueden enviarse hacia abajo y nunca volver a enviarse. También podemos pensar en los accesorios como objetos. Esto se debe a que esencialmente contienen datos similares a pares clave:valor. Para volver a explicar por qué son similares a los parámetros es que almacenan múltiples objetos dentro de ellos. Me gusta pensar en el área donde se reciben los accesorios como marcadores de posición. Ocupan espacio para algún objeto que queremos compartir con nuestro componente y se intercambian cuando lo necesitamos, mediante desestructuración y notación de puntos.

Aquí tienes una buena forma de visualizarlo:

Aquí podemos visualizar accesorios que contienen todo dentro de nuestros cuadros cuadrados, cada uno con su valor de datos respectivo de nuestro primer ejemplo. Ahora simplemente usamos nuestro método de desestructuración para captar el valor de nuestro accesorio. ¡Y así es como se usan los accesorios en pocas palabras!