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

id, title, challengeType, forumTopicId, dashedName

id	title	challengeType	forumTopicId	dashedName
5a24c314108439a4d4036145	Mappare lo stato sulle props	6	301433	map-state-to-props

--description--

Il componente Provider consente di fornire state e dispatch ai componenti React, ma devi specificare esattamente quale stato e azioni desideri. In questo modo, ti assicuri che ogni componente abbia accesso solo allo stato di cui ha bisogno. Lo si ottiene creando due funzioni: mapStateToProps() e mapDispatchToProps().

In queste funzioni, dichiari a quali parti dello stato vuoi avere accesso e quali creatori di azione devi essere in grado di inviare. Una volta che queste funzioni saranno pronte, vedrai come utilizzare il metodo React Redux connect per collegarli ai tuoi componenti in un'altra sfida.

Nota: Dietro le quinte, React Redux utilizza il metodo store.subscribe() per implementare mapStateToProps().

--instructions--

Crea una funzione mapStateToProps(). Questa funzione dovrebbe prendere state come argomento, quindi restituire un oggetto che mappa quello stato a specifici nomi di proprietà. Queste proprietà diventeranno accessibili al tuo componente tramite props. Dal momento che questo esempio mantiene l'intero stato dell'app in un unico array, è possibile passare l'intero stato al tuo componente. Crea una proprietà messages nell'oggetto che viene restituito e impostala a state.

--hints--

La costante state dovrebbe essere un array vuoto.

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

mapStateToProps dovrebbe essere una funzione.

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

mapStateToProps dovrebbe restituire un oggetto.

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

Passare un array come stato a mapStateToProps dovrebbe restituire questo array associato a una chiave 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
  }
};