0
237
VistasMatriz de edición JS: la cantidad del resultado es incorrecta y el objeto perdido
Cuando hago clic en este botón:
const addToCart = () => { dispatch({ type: "ADD_TO_CART", item:{ id:id, name: name, image: image, price: price, score: score, releaseDate: releaseDate, amount: amount // this is defaulted as 1 } }) }Lo envía a mi clase reductora que almacena datos, estoy tratando de editarlo para que solo tenga una instancia única de un elemento específico y solo aumente la cantidad
case 'ADD_TO_CART': for (let x of state.cart){ // this should get fired if the object is found and increase amount by specified if (x.id === action.item.id){ let newCart1 = [...state.cart]; newCart1[x] = { ...newCart1[x], amount: x.amount += action.item.amount } return {...state, cart: [newCart1]} } } return { ...state, cart: [...state.cart, action.item], }; // this should get fired if it is not found and add the whole objectHay dos problemas.
Si agrego un elemento inicial, funciona (objeto inicial) si agrego un segundo del mismo elemento, aumentará la cantidad a 3 en lugar de 2
Además de eso, agrega un "Objeto de objeto" con una cantidad de 3 que no sé qué es esto o cómo se incluye dado que la matriz tiene una longitud de 1 (segundo objeto)
2 Respuestas
Responde la pregunta0
Esta pregunta se relaciona más con encontrar y resolver un error en el código. A continuación se muestra un intento de hacerlo.
- Esta línea
for (let x of state.cart)indica quexes un elemento destate.cart(una matriz) - La siguiente línea:
if (x.id === action.item.id)refuerza quexno es solo un elemento, sino que probablemente sea unobjectque tiene unaidde propiedad. - A continuación,
let newCart1 = [...state.cart];indica quenewCart1es una copia superficial del object-arraystate.cart - Y aquí (en la siguiente tarea) yace el problema (creo):
newCart1[x] = { ...newCart1[x].....<---xes un objeto y está siendo usado como índice para acceder anewCart1. ¿Puede ser necesario encontrar el índice de laidcoincidente y usar eso aquí (en lugar de[x])?
Es posible que esta respuesta deba actualizarse en función de una respuesta / aclaración adicional de OP.
Observación
En lugar de recorrer la matriz del cart , si se puede garantizar que action.item.id solo coincidirá con un artículo en la matriz del cart , ¿por qué no hacer esto?
case 'ADD_TO_CART': const newCart1 = [...state.cart]; const tgtIdx = newCart1.findIndex(({ id }) => id === action.item.id); if (tgtIdx >= 0 && tgtIdx < newCart1.length) { newCart1[tgtIdx] = { ...state[tgtIdx], amount: state.cart[tgtIdx].amount + action.item.amount }; return { ...state, cart: [...newCart1]}; }; return { ...state, cart: [...state.cart, action.item] }; Nota: El bucle for...of existente también apuntará solo a la primera aparición, ya que en el momento en que encuentra una coincidencia, ejecuta un return desde dentro del bucle.
0
case 'ADD_TO_CART': const newCart1 = [...state.cart]; const tgtIdx = newCart1.findIndex(({ id }) => id === action.item.id); if (tgtIdx >= 0 && tgtIdx < newCart1.length) { newCart1[tgtIdx] = { ...newCart1[tgtIdx], amount: newCart1[tgtIdx].amount + action.item.amount} return { ...state, cart: [...newCart1]}; }; return { ...state, cart: [...state.cart, action.item] };