React es una biblioteca de JavaScript gratuita y de código abierto para el diseño de UI. Representa los componentes escritos en JSX. Introduce el concepto de accesorios . Los accesorios se utilizan para pasar datos de los componentes principales a los componentes secundarios. Estos accesorios solo pueden ser actualizados por el componente principal. Es de solo lectura para componentes secundarios. Es posible que necesitemos accesorios dentro del constructor del componente secundario con esta palabra clave. La función Super() llama al constructor de la clase principal. El uso de superconstructor con argumentos props básicamente permite acceder a this.props en una función Constructor.
Vamos a crear un proyecto React y luego crearemos una interfaz de usuario para mostrar el propósito anterior. Los usuarios podrán ver la aplicación del superconstructor con el argumento props.
Creando proyecto React:
Paso 1: Cree una aplicación de reacción escribiendo el siguiente comando en la terminal.
npx create-react-app project_name
Paso 2: Ahora, vaya a la carpeta del proyecto, es decir, project_name ejecutando el siguiente comando.
cd project_name
Estructura del proyecto: Tendrá el siguiente aspecto:
Ejemplo: Vamos a crear un superconstructor con argumento props.
App.js
import React from "react"; class App extends React.Component { constructor(props){ super(props); console.log("Empty props ", this.props); } render() { return ( <div> <p>Hello World!</p> </div> ); } } export default App;
Paso para ejecutar la aplicación: ejecute la aplicación utilizando el siguiente comando desde el directorio raíz del proyecto:
npm start
Salida: Abra su navegador. De forma predeterminada, abrirá una pestaña con localhost ejecutándose. Como se muestra en la imagen, los accesorios se registran en la consola. Aquí los accesorios no tienen nada, por eso es un objeto vacío.
Incluso puede consultar estos artículos de GFG para obtener más claridad:
- ¿Cuál es la diferencia entre super() y super(props) en reaccionar?
- ¿Cuál es el uso de super (accesorios)
Publicación traducida automáticamente
Artículo escrito por namankedia y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA