남들은 되는데 왜난안되는거지?
컴포넌트를 나눠서 코드를 작성하고 이미지에 true값을 State로 달아 토글 버튼을 구현하고 싶었다.
useState 의 변수값을 true로 설정하고 변수를 변경해줄 함수에 !변수 를 설정해놓은 함수를 작성한뒤
이미지의 state값이 변할때마다 색상이 변하는 클릭이벤트를 달아준후 삼항연산자를 이용해 스타일 색상을 변환시켜주었다.
다 내가 생각한대로.... 된다고 생각했는데....
문제는 맵메서드를 이용해 토글이 구현된 리플리스트를 주르륵 뽑아냈을때 발생했다.
그 어떤버튼을 눌러도 모든 버튼의 색이 변해버린것...
스테이트는 하난데 토글은 여러개고 그모든토글이 하나의 스테이트를 변경시켜버리는 문제가 발생한것이였다.
한참을 고민하다가 아! 댓글을 따로 컴포넌트화 시켜서 props로 전달하자! 라는생각이 번뜩 들었고
바로 실행한 결과!
는 참혹했다...
바보같은나는 스테이트는어차피 하나다 라는걸이해하지 못한것이였고
해답은 스테이트 자체를 컴포넌트로 빼내어 그자체를 맵으로 돌려버리면 간단한거였다.
스테이트 자체가 맵으로 순회하여 자가복제가 된상태니 각각의 토글에 하나씩의 스테이트가 붙을수 있었다.
조금씩 리액트에 적응해가는 모습이 아주좋다.
죽어라 해보자