$$config title: ootd 장바구니 리스트 아이템 keywords: - react - html $$ # ```java import axios from "axios"; import React, { useState } from "react"; import { useEffect } from "react"; import cn from "classnames"; import { MdCheckBoxOutlineBlank, MdCheckBox } from "react-icons/md"; import { FaRegMinusSquare, FaRegPlusSquare } from "react-icons/fa"; import { constSelector } from "recoil"; const BuyListItem = ({ item, index, onToggle, totalCount, setTotalCount, totalPrice, setTotalPrice, cartDelete, }) => { let sessionStorage = window.sessionStorage; const userId = sessionStorage.getItem("id"); // console.log(item.prdId); const [list, setList] = useState(""); const [count, setCount] = useState(item.amount); const [price, setPrice] = useState(item.price); const [unitPrice, setUnitPrice] = useState(0); const { checked } = item; useEffect(() => { const getData = async () => { // console.log("amount", item.amount); // console.log("prdId", cart.prdId); const data = await axios({ url: `http://localhost:4000/cartList2`, method: "POST", data: { prdId: item.prdId, count, }, }); setList(data.data); }; getData(); }, [item, count, price]); const onClick = async () => { cartDelete(item.prdId, userId); }; return (

{ onToggle(userId, item.prdId); }} > {checked ? ( ) : ( // // )}

{list.prdName}

{list.prdEName}

{list.prdPrice}

{ if (count <= 1) { alert("최소 수량입니다."); } else { const data = await axios({ url: `http://localhost:4000/amount/${item.prdId}`, method: "PATCH", data: { count: count - 1, price: price - list.prdPrice }, }); setCount(count - 1); setTotalCount(totalCount - 1); setPrice(price - list.prdPrice); setTotalPrice(totalPrice - (price - list.prdPrice)); } }} >

{count}

{ const data = await axios({ url: `http://localhost:4000/amount/${item.prdId}`, method: "PATCH", data: { count: count + 1, price: price + list.prdPrice }, }); setCount(count + 1); setTotalCount(totalCount + 1); setPrice(price + list.prdPrice); setTotalPrice(totalPrice + (price + list.prdPrice)); }} >

{/* */} {price} {/* {list.prdPrice.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")} */} ); }; export default BuyListItem; ```