La diferencia entre componentes de presentación y de contenedor en React
En React, los componentes a menudo se dividen en dos grandes grupos: componentes de presentación y componentes contenedores .
Cada uno de ellos tiene sus características únicas.
Los componentes de presentación se ocupan principalmente de generar algún marcado para su salida.
No gestionan ningún tipo de estado, salvo el relacionado con la presentación.
Los componentes del contenedor se ocupan principalmente de las operaciones de “backend”.
Pueden gestionar el estado de varios subcomponentes, pueden encapsular varios componentes de presentación y pueden interactuar con Redux .
Como forma de simplificar la distinción, podemos decir que los componentes de presentación se ocupan de la apariencia , mientras que los componentes contenedores se ocupan de hacer que las cosas funcionen .
Por ejemplo, este es un componente de presentación. Obtiene datos de sus propiedades y se centra únicamente en mostrar un elemento:
const Users = props = ( ul {props.users.map(user = ( li{user}/li ))} /ul)
Por otra parte, este es un componente contenedor. Gestiona y almacena sus propios datos y utiliza el componente de presentación para mostrarlos.Te recomendamos Activación muscular NEURO_MUSCLE INTERACTION TECHNIQUES
class UsersContainer extends React.Component { constructor() { this.state = { users: [] } } componentDidMount() { axios.get('/users').then(users = this.setState({ users: users })) ) } render() { return Users users={this.state.users} / }}
Tal vez te puede interesar:
- Introducción a React
- Agregar evento de clic a los elementos DOM devueltos desde querySelectorAll
- Cómo cambiar el valor de un nodo DOM
- Cómo comprobar si un elemento DOM tiene una clase
React: componentes de presentación y de contenedor
En React, los componentes a menudo se dividen en dos grandes grupos: componentes de presentación y componentes contenedores . La diferencia entre componentes
programar
es
2025-01-17
Si crees que alguno de los contenidos (texto, imagenes o multimedia) en esta página infringe tus derechos relativos a propiedad intelectual, marcas registradas o cualquier otro de tus derechos, por favor ponte en contacto con nosotros en el mail [email protected] y retiraremos este contenido inmediatamente