TIL _ [props]

Today 공부

---

handleDelete

const handleDelete = (itemId) => {
    setCheckedItems(checkedItems.filter((el) => el !== itemId))
    // setCartItems(cartItems.filter((el) => el.itemId !== itemId))
    // let arr = [...cartItems]
    cartItems.splice(cartItems.findIndex((el) => el.itemId === itemId) , 1)
    setCartItems([...cartItems])
  }

handleQuantityChange

  const handleQuantityChange = (quantity, itemId) => {
    cartItems.forEach((el) => {
      if(el.itemId === itemId){
        el.quantity = quantity;
        setCartItems([...cartItems]);
      }
    })
  }

renderItems

  const renderItems = items.filter((el) => cartItems.map((el) => el.itemId).indexOf(el.id) > -1)
  // 모든아이템 을 필터하는데 map(장바구니에 있는 id만 가진 배열).indexOf(필터(el.id)) > -1
  // [1,2,5].indexOf(itmes(el.id)) > -1
  // [1,2,5].indexOf(3) > -1 (배열에 들어있는 애들만 filtering 돼서리턴)

handleClick

  const handleClick = (e, id) => {
    let count = 0;
    cartItems.forEach((el) => {
      if (el.itemId === id) {
        count++;
        el.quantity++;
        setCartItems([...cartItems]);
      }
    });
    if (count === 0) {
      let obj = { itemId: id, quantity: 1 };
      setCartItems([...cartItems, obj]);
    }
  };

---

마치며,

state와 props 상태끌어올리기를 구현하며 다시 한번 더 복습하게되었다.