freeCodeCamp/curriculum/challenges/espanol/03-front-end-libraries/react-and-redux/map-state-to-props.md

id, title, challengeType, forumTopicId, dashedName

id	title	challengeType	forumTopicId	dashedName
5a24c314108439a4d4036145	Asigna el estado a props	6	301433	map-state-to-props

--description--

El componente Provider te permite proporcionar state y dispatch a tus componentes React, pero debes especificar exactamente qué estado y acciones quieres. De esta manera, te aseguras de que cada componente sólo tiene acceso al estado que necesita. Esto se consigue creando dos funciones: mapStateToProps() y mapDispatchToProps().

En estas funciones, declaras a qué partes del estado quieres tener acceso y qué creadores de acción necesitas poder enviar. Una vez que estas funciones están en su lugar, verás cómo usar el método React Redux connect para conectarlos a tus componentes en otro desafío.

Nota: Tras bambalinas, React Redux utiliza el método store.subscribe() para implementar mapStateToProps().

--instructions--

Crea una función mapStateToProps(). Esta función debe tomar state como argumento, y luego devolver un objeto que asigna ese estado a nombres de propiedades específicas. Estas propiedades serán accesibles a tu componente a través de props. Dado que este ejemplo mantiene todo el estado de la aplicación en un solo arreglo, puedes pasar todo ese estado a tu componente. Crea una propiedad messages en el objeto que se devuelve, y establécela como state.

--hints--

La const state debe ser un arreglo vacío.

assert(Array.isArray(state) && state.length === 0);

mapStateToProps debe ser una función.

assert(typeof mapStateToProps === 'function');

mapStateToProps debe devolver un objeto.

assert(typeof mapStateToProps() === 'object');

Pasar un arreglo como estado a mapStateToProps debe devolver este arreglo asignado a una clave de messages.

assert(mapStateToProps(['messages']).messages.pop() === 'messages');

--seed--

--seed-contents--

const state = [];

// Change code below this line

--solutions--

const state = [];

// Change code below this line

const mapStateToProps = (state) => {
  return {
    messages: state
  }
};