Aquí está la pregunta:
En manageFriends.js, escribe una función llamada manageFriends que tome el estado anterior y una acción como argumento. Aquí, el estado inicial debe ser un objeto con una clave, amigos, establecida en una matriz vacía. Esta vez, el reductor debería poder manejar dos acciones, "amigo/agregar" y "amigo/eliminar". Al agregar un amigo, la acción incluirá una clave de amigo asignada a un objeto con claves de nombre, ciudad natal e identificación.
action = { type: "friends/add", payload: { name: "Chrome Boi" homewtown: "NYC", id: 1 } }Cuando nuestro reductor recibe "amigos/agregar", debe devolver un nuevo estado con este objeto amigo agregado a la matriz de amigos.
Aquí está mi código, que estoy ejecutando en la consola de mi navegador js
function manageFriends(state = {friends: []}, action = { type: "friends/add", payload: { name: 'Mac Miller', hometown: 'Arizona', id: 1 }, payload: { name: 'Kirk Franklin', hometown: 'ATL', id: 1 }, type: "friends/remove", payload: 1, }){ switch (action.type) { case 'friends/add': return {friends: [...state.freinds, action.payload]} case 'friends/remove': return { friends: state.friends.filter((friend) => friend.id !=action.payload) }; default: return state; } } manageFriends(state, action)cuando ejecuto el reductor todavía obtengo una matriz vacía.
{friends: Array(0)} friends: Array(0) length: 0 [[Prototype]]: Array(0) [[Prototype]]: ObjectEncontré este ejemplo que me ayudó con la declaración de cambio de caso. Pero creo que el tema gira en torno a la acción.
Anteriormente probé esta función Esto funcionó perfectamente bien para mí
let state = {presents : true} function managePresents(state, action){ action = { type: "presents/increase",}; switch (action.type) { case 'presents/increase': return { presents: !state.presents} default: return state; } } managePresents(state, action)Resultado: {presenta: falso}
¿Alguna idea sobre cómo actualizar el estado de la matriz (amigos) usando redux?
El problema es que estás tratando de hacer demasiado con una función simple. Se supone que la acción tiene dos argumentos clave, TIPO y CARGA, no múltiples declaraciones que se juntan.
Ayudaría si intentara ejecutar la función Una vez (manageFriends) a la vez. O intente usar un bucle/forEach si necesita ejecutarlo varias veces.
const initialState = { friends: [] }; let action = { type: 'friends/add', payload: { name: 'Mac Miller', hometown: 'Arizona', id: 1, }, }; function manageFriends(state, action) { switch (action.type) { case 'friends/add': return { friends: [...state.friends, action.payload] }; case 'friends/remove': return { friends: state.friends.filter((friend) => friend.id != action.payload), }; default: return state; } } manageFriends(initialState, action);