Reaccionar-redux Tutorial
React Redux es una biblioteca que proporciona enlaces React para Redux.
Los componentes de React que conocen la tienda Redux se denominan “Contenedores”, “Componentes inteligentes” o “Componente de orden superior” (HOC). Dichos componentes, para usar Redux, necesitan:
- Suscríbete a la tienda para recibir actualizaciones de la tienda Redux
- Acciones de despacho
Hacer esto a mano implicaría usar store.subscribe
y store.dispatch(action)
en contenedores React.
React Redux simplifica el enlace entre la tienda de Redux y un componente de contenedor de React mediante la función conectar
, que asigna las propiedades de estado de Redux y los creadores de acciones a los accesorios del componente.
conectar
es una función que crea un componente de orden superior. Connect acepta 3 funciones (mapStateToProps
, mapDispatchToProps
, mergeProps
) y devuelve un componente contenedor, que envuelve el componente original para convertirlo en un componente “conectado”:
import { connect } from 'react-redux';
const Customers = { ... };
const mapStateToProps = (state) => { ... }
const mapDispatchToProps = (dispatch) => { ... }
export default connect(mapStateToProps, mapDispatchToProps)(Customers);
Consulte la sección de ejemplos para ver un ejemplo completo.
Dado que todos los componentes del contenedor necesitan acceder a la tienda de Redux, la forma recomendada es usar un componente <Provider>
especial de React Redux, que pasa la tienda a todos los componentes secundarios (internamente usando el contexto de React).
Documentación oficial: http://redux.js.org/docs/basics/UsageWithReact.html
repositorio de GitHub: https://github.com/reactjs/react-redux