Saltar al contenido

Diferencia entre el Estado y los apoyos en ReactSep, 8thIn este tutorial, vamos a aprender acerca de lo que es la diferencia …

marzo 13, 2020

 

En este tutorial, vamos a aprender acerca de cuál es la diferencia entre el estado y los apoyos de reaccionar con la ayuda de ejemplos.

Estado

  • En reaccionar estado nos ayuda a almacenar los datos de componentes específicos, los datos que almacena en el estado no es público.
  • Estado es mutatable en reaccionar.
  • La única manera de actualizar el estado en reaccionar es mediante el uso this.setState método (). actualizaciones
  • Estado va a volver a hacer su componente con los cambios actualizados.

Veamos un ejemplo.

import React, { Component } from "react";

class Counter extends Component {
// state is initialzed with count value 0
state = {
count: 0
};

handleIncrement = () => {
//updating count value
this.setState({
count: this.state.count + 1
});
};

render() {
return (

{count}

);
}
}

export default Counter;

Apoyos

  • apoyos se utilizan para pasar los datos de componente de los padres (estado) a los componentes niño, significa que mediante el uso de apoyos que se comunican con los componentes niño.
  • apoyos son de sólo lectura en reaccionar.

Veamos un ejemplo.

import React, { Component } from "react";
import Welcome from "./Welcome";

class App extends Component {
state = {
msg: "Welcome to react"
};

render() {
return (

Learning react

// passing message prop to the Welcome component

);
}
}

export default App;

En el código anterior, que pasó el mensaje a prop componente .

Ahora, dentro del componente de bienvenida que puede acceder el puntal mensaje usando this.props. componentes hijos

import React, { Component } from "react";

class Welcome extends Component {

render() {
console.log(this.props.message); //Welcome to react
return (

{this.props.message}

);
}

}

dentro, que no pueden cambiar los accesorios.

Conclusión

El estado se utiliza para el almacén de los datos de los componentes centrales, por el uso de accesorios estamos pasando estado abajo a los componentes hijos en lugar de crear un estado en el que cada componente.