"map : 많은 div들을 반복문으로 줄이고 싶은 충동이 들 때 " 수업을 들으며 다른 기능들도 시도해보다가 궁금증이 생겨 질문 드립니다.
let [따봉, 따봉증가] = useState(0);
따봉 이라는 변수가 클릭을 할때마다 초기값 0에서 1씩 증가하는데,
만약 처음에는 " 따봉" 변수의 초기값 0이 화면에 보이지 않다가 클릭해서 {따봉}이 1이 되는 순간, 즉 {따봉증가} 함수가 작동하는 순간부터 보이게 하는 방법이 뭐가 있을까요?
state를 변경하는 것 말고 다른 방법은 떠오르지 않아서
let [따봉, 따봉증가] = useState(0, false);
이런거 안되는거 알면서도 이것저것 시도해봤는데 역시나 안돼서 여쭤봅니당

처음엔 위와 같이 0이 보이지 않는 모습이다가 onClick={()=>{따봉증가(따봉+1)}} 하는 순간

숫자가 나타나게 하고 싶습니다.
function App() {
let [a, b] = useState(["가나다", "라마바", "사아자", "차카타"]);
let [따봉, 따봉증가] = useState(0);
return (
<div>
{a.map(() => {
<div className="list">
<h3>{i}</h3>
<p onClick={() => {따봉증가(따봉 + 1); } } > 😊{따봉} </p>
<p>2022년 2월 14일</p>
</div>;
})}
</div>
);
}