Inicio > JavaScript, React, Uncategorized > Cuando se usa Super() y Super(props) en React.js

Cuando se usa Super() y Super(props) en React.js


Cuando trabajamos con React.js  muchas veces tenemos errores en el contructor por no declarar el método  Super  vamos a ver algunos ejemplo de cuando es necesario:

class MyComponent extends Component {
    constructor(){
        super();
        this.state = {
            name: ''; 
        };
    }
    render () {
        return (
            <p> Name: { this.state.name }</p>
        );
    }
}

Para el caso anterior es necesario usar Super para poder usar la clausula “this” dentro del constructor y definir la variable de estado name.

Si suponemos que el valor viene en una propiedad recibida desde el componente padre tendríamos el siguiente código:

class MyComponent extends Component {
    constructor(props){
        super(props);
        this.state = {
            name: this.props.name; 
        };
    }
    render () {
        return (
            <p> Name: { this.state.name }</p>
        );
    }
}

Para este ultimo caso es necesario pasar por el método Super las props que se están recibiendo pues si esta linea no existe tendremos una excepción.

Para resumir:

Super -> habilita this dentro del constructor del componente

Super(props) -> habilita this.props dentro del constructor  del componente

Anuncios
  1. Aún no hay comentarios.
  1. No trackbacks yet.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

w

Conectando a %s

A %d blogueros les gusta esto: