Guida · Lo stato
Agganciare un componente allo stato
Due blocchi che si parlano senza conoscersi. Non si passano un riferimento: leggono e scrivono lo stesso nome.
Dove siamo
Sai emettere eventi e sai farli scattare. Alla fine di questo capitolo due blocchi distanti si muoveranno insieme, e nessuno dei due saprà dell’altro.
Il gesto
Metti un blocco che scrive uno stato: un’azione con ui:set e un payload { key, value }.
Metti altrove un blocco che reagisce: trigger: on:stateChange sulla stessa chiave.
Salva, ricarica, clicca.
// il uiState di un blocco, in Payload
{
"uiState": {
"events": [
{ "trigger": "on:click", "event": "ui:set",
"payload": { "key": "pannelloAperto", "value": true } }
]
}
}Cos’è appena successo
Lo stato è una mappa piatta: chiave, valore. Chi scrive nomina una chiave, chi legge nomina la stessa chiave, e il collegamento fra i due è quel nome — non un riferimento, non una prop passata da un genitore.
La differenza con uno stato React privato non è accademica. Uno stato privato è raggiungibile solo dall’interno del componente che lo tiene; una chiave dello store ha un indirizzo, quindi chiunque può leggerla o cambiarla. È il motivo per cui un bottone in fondo alla pagina può aprire un pannello in cima.
Il prezzo è che una mappa piatta è uno spazio di nomi condiviso, e due chiavi uguali sono la stessa chiave. Il capitolo dopo è esattamente su questo.
Come un nodo osserva
const { open } = useSliceState(['nodo-42:open'])Cosa succede a chi non la guarda
// niente: non viene risvegliato. // Un nodo che guarda zero chiavi non si sottoscrive affatto.
Quando non funziona
Scrivi su una chiave che nessuno legge. Lo stato cambia davvero e non si vede niente: nessuno ha chiesto di essere svegliato per quel nome.
Al contrario, leggi una chiave che nessuno scrive e ottieni il valore iniziale per sempre. In entrambi i casi il sistema fa il suo lavoro — è il nome che non combacia.
Avanti
Una mappa piatta funziona finché i blocchi sono uno. Nel capitolo dopo: tre accordion nella stessa pagina.