Re-ordering of cart: Fix
Aminur-Application opened this issue · comments
For those who wanted the cart order to remain the same after increasing or decreasing the quantity,
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity + 1}, ...newCartItems.slice(index)])
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity - 1}, ...newCartItems.slice(index)])
https://stackoverflow.com/questions/586182/how-to-insert-an-item-into-an-array-at-a-specific-index-javascript
--refer to the link for more info
Thanks worked for me
Thank you! This also worked well for me!
For those who wanted the cart order to remain the same after increasing or decreasing the quantity,
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity + 1}, ...newCartItems.slice(index)])
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity - 1}, ...newCartItems.slice(index)])
https://stackoverflow.com/questions/586182/how-to-insert-an-item-into-an-array-at-a-specific-index-javascript --refer to the link for more info
Great answer
I tried in a bit crude way:
`
const toggleCartItemQuantity = (id, value) => {
foundProduct = cartItems.find((item) => item._id === id);
index = cartItems.findIndex((product) => product._id === id);
const newCartItems = cartItems.filter((item) => item._id !== id);
if (value === 'inc') {
let finalCartItems = [...newCartItems, { ...foundProduct, quantity: foundProduct.quantity + 1 }];
let length = finalCartItems.length;
[finalCartItems[index], finalCartItems[length - 1]] = [finalCartItems[length - 1], finalCartItems[index]];
setCartItems(finalCartItems);
setTotalPrice((prevTotalPrice) => prevTotalPrice + foundProduct.price);
setTotalQuantities((prevTotalQuantities) => prevTotalQuantities + 1);
}
else if (value === 'dec') {
if (foundProduct.quantity > 1) {
let finalCartItems = [...newCartItems, { ...foundProduct, quantity: foundProduct.quantity - 1 }];
let length = finalCartItems.length;
[finalCartItems[index], finalCartItems[length - 1]] = [finalCartItems[length - 1], finalCartItems[index]];
setCartItems(finalCartItems);
setTotalPrice((prevTotalPrice) => prevTotalPrice - foundProduct.price);
setTotalQuantities((prevTotalQuantities) => prevTotalQuantities - 1);
}
}
}
`
I have figured out with this way using splice
use Splice with index to update newCartItems then simply setCartitems as newCartItems
const toggleCartItemQuantity = (id, value) => {
foundProduct = cartItems.find((item) => item._id === id);
index = cartItems.findIndex((product) => product._id === id);
const newCartItems = cartItems.filter((item) => item._id !== id);
if (value === "inc") {
newCartItems.splice(index, 0, {...foundProduct, quantity: foundProduct.quantity + 1})
setCartItems([ ...newCartItems ]);
setTotalPrice((prevTotalPrice) => prevTotalPrice + foundProduct.price);
setTotalQuantities((prevTotalQuantities) => prevTotalQuantities + 1);
} else if (value === "dec") {
if (foundProduct.quantity > 1) {
newCartItems.splice(index, 0, {...foundProduct, quantity: foundProduct.quantity - 1})
setCartItems([ ...newCartItems ]);
setTotalPrice((prevTotalPrice) => prevTotalPrice - foundProduct.price);
setTotalQuantities((prevTotalQuantities) => prevTotalQuantities - 1);
}
}
};
For those who wanted the cart order to remain the same after increasing or decreasing the quantity,
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity + 1}, ...newCartItems.slice(index)])
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity - 1}, ...newCartItems.slice(index)])
https://stackoverflow.com/questions/586182/how-to-insert-an-item-into-an-array-at-a-specific-index-javascript --refer to the link for more info
Thanks for the fix, worked for me !
For those who wanted the cart order to remain the same after increasing or decreasing the quantity,
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity + 1}, ...newCartItems.slice(index)])
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity - 1}, ...newCartItems.slice(index)])
https://stackoverflow.com/questions/586182/how-to-insert-an-item-into-an-array-at-a-specific-index-javascript --refer to the link for more info
thanks !!!
For those who wanted the cart order to remain the same after increasing or decreasing the quantity,
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity + 1}, ...newCartItems.slice(index)])
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity - 1}, ...newCartItems.slice(index)])
https://stackoverflow.com/questions/586182/how-to-insert-an-item-into-an-array-at-a-specific-index-javascript --refer to the link for more infoGreat answer 🤗🤗
I tried in a bit crude way: ` const toggleCartItemQuantity = (id, value) => { foundProduct = cartItems.find((item) => item._id === id); index = cartItems.findIndex((product) => product._id === id);
const newCartItems = cartItems.filter((item) => item._id !== id); if (value === 'inc') { let finalCartItems = [...newCartItems, { ...foundProduct, quantity: foundProduct.quantity + 1 }]; let length = finalCartItems.length; [finalCartItems[index], finalCartItems[length - 1]] = [finalCartItems[length - 1], finalCartItems[index]]; setCartItems(finalCartItems); setTotalPrice((prevTotalPrice) => prevTotalPrice + foundProduct.price); setTotalQuantities((prevTotalQuantities) => prevTotalQuantities + 1); } else if (value === 'dec') { if (foundProduct.quantity > 1) { let finalCartItems = [...newCartItems, { ...foundProduct, quantity: foundProduct.quantity - 1 }]; let length = finalCartItems.length; [finalCartItems[index], finalCartItems[length - 1]] = [finalCartItems[length - 1], finalCartItems[index]]; setCartItems(finalCartItems); setTotalPrice((prevTotalPrice) => prevTotalPrice - foundProduct.price); setTotalQuantities((prevTotalQuantities) => prevTotalQuantities - 1); } }
} `
THANKS