state2 댓글창 데이터 가져오는 방식 업데이트하기 문제 발생 comment 데이터를 관리하는 state를 구별없이 getComments 하나로 설정하니까 트윗 상자 하단에 위치한 댓글 버튼을 누르면 모든 트윗게시물의 댓글창이 열리는 문제가 발생했다. 실제 코드 수정 전 const openComments = ({ id, number }: any) => { customAxios .post("/getComments", { tweet_id: id, }) .then((response) => { data[number].is_opened = response.data.is_opened; setGetData([...data]); setGetComments(response.data.data); }); }; comment 값들을 관리하는 state를 getComments .. 2024. 1. 22. 상태관리 도입해서 전역 변수 관리하기(Redux, React Query) 상태 관리를 도입했다. 프로젝트가 계속 진행되면서 전역적으로 사용해야하는 변수들이 생겨났기 때문이다. 예를 들어 로그인 유무를 알 수 있는 isLogin과 같은 변수는 전역적으로 관리하여 로그인 상태일때는 home이나 다른 페이지를 보여주고 로그인을 해야하는 상태에는 Auth 화면을 보여준다. 상태관리는 redux, react- query 2개를 사용했다. 처음에는 redux를 사용했다가 다양한 기능과 백엔드 시스템과의 연동을 쉽게 구현할 수 있는 react-query를 도입하여 사용해보았다. 이번 글에서는 리덕스 기본 흐름과 도입 과정, 실제 코드에 대해서 작성해볼려고 한다. 리덕스 도입 리덕스 기본 흐름 특정한 액션이 유발(dispatch)되면 / 이에 대응하는 reducer가 변화한 상태 state.. 2024. 1. 21. 이전 1 다음
