Objetos de estado complejo (profundo) React-Redux
Dado mi estado redux inicial es:
const state = {
currentView: 'ROOMS_VIEW',
navbarLinks: List([
{name: 'Rooms', key: 'ROOMS_VIEW'},
{name: 'Dev', key: ''}
]),
roomListsSelected: {group: 0, item: 0},
roomLists: [
{
name: "Filters",
expanded: true,
listItems: [
{ icon: 'images/icon-warning.svg', name: 'Alerts', filter: room => room.hasAlert },
{ icon: 'images/icon-playlist.svg', name: 'In Progress', filter: room => room.progress > 20 },
{ icon: 'images/icon-playlist.svg', name: 'Almost Done', filter: room => room.progress > 90 },
{ icon: 'images/icon-playlist.svg', name: 'Complete', filter: room => room.status === 'complete' },
{ icon: 'images/icon-playlist.svg', name: 'Recently Completed', filter: room => false },
{ icon: 'images/icon-playlist.svg', name: 'All Rooms', filter: room => true }
]
}
],
rooms: List(generateRooms())
}
Necesito hacer un reductor que haga esto:
state.roomList[n].expanded = !state.roomList[n].expanded
Soy nuevo en el uso de un flujo de trabajo de Redux y la mejor manera de resolver esto es hacer que roomList sea un objeto inmutable.js o escribir algún código para hacer un clon profundo de mi objeto de estado.
También state.roomList tendrá nuevos datos enviados desde futuras características.
Verano / Pregunta: ¿Cuál es la mejor manera de devolver un nuevo objeto de estado en un reductor al realizar cambios como este en el estado, o debería cambiar la estructura del objeto de estado de Redux?
Lo que hice Al final, Inmutable parece el camino a seguir. Hay algunos trucos con Immutable para reducir el tiempo de procesamiento de reacción y cumple con todos los requisitos del proyecto. También es lo suficientemente temprano en el proyecto para usar una nueva biblioteca sin hacer cambios importantes.