버튼 + / - 클릭시 기능 함수로 빼기
"use client"
import { useState } from "react";
export default function List() {
let products = ['토마토', '바나나', '기러기']
let [cnt, setCnt] = useState([0,0,0])
function calcCnt(action, idx) {
let tmpCnt = [...cnt];
if(action > 0) {
tmpCnt[idx]++;
setCnt( tmpCnt)
} else {
tmpCnt[idx]--;
setCnt( tmpCnt)
}
}
return (
<div>
<h2>Products</h2>
{
products.map((item, i)=> {
return (
<div className="food" key={i}>
< img src={`/food${i}.png`} className="food-img"/>
<h4> {i+1}. {item} $40</h4>
<span>{cnt[i]}</span>
<button onClick={()=>{calcCnt(-1,i)}}> - </button>
<button onClick={()=>{calcCnt(1,i)}}> + </button>
</div>
)
})
}
</div>
)
}
