1. router push query
router에 정보를 담아서 보낼 수 있다. 지금까지 roter로 push해서 페이지만 이동할 수 있는 줄 알았다. 그래서 props로만 데이터를 보낼 수 있을 줄 알았는데 구글 검색결과 query를 이용해서 특정 데이터를 보낼 수 있다. 그 결과 props로 연결이 되지 않은 컴포넌트에서 특정 값을 사용할 수 있었다.
가. props를 이용하지 않고 데이터 전송
project에서 카테고리 5개를 한 컴포넌트로 create를 만들고 싶었다.
카테고리로 분기를 만들어서 들어오는 값에 따라서 특정 값만 띄워주고 싶었다.
하지만 write버튼을 눌렀을 때 컴포넌트가 연결되지 않기 때문에 props로 내려줄 수 없었다.
category 내에서 write 버튼을 눌렀을 경우 특정 값을 보내주고 그 값을 write component에서 받아서 그 값에 따라서 확이 후 서로 다른 페이지를 렌더링 하도록 보여줬다.
일반 리뷰 페이지에서 내려주는 값
2. write page 카테고리 분기 작업
지금까지 project를 진행하면서 생각없이 컴포넌트를 너무 많이 만들어서 폴더가 너무 많아졌다. 한 기능씩 맡아서 진행하다 보니 계속해서 폴더를 생성하고 컴포넌트가 나오기 때문에 무한증식하는 사태가 벌어졌다. 이에 카테고리 별로 write page를 만드는 과정에서 기존의 write page를 이용하기로 했고 작업을 진행했다.
가. 기존의 카테고리의 컴포넌트에서 구분할 수 있는 데이터를 내려줬다.
일반 리뷰 페이지에서 내려주는 값
상기 사진과 같이 모든 컴포넌트에서 카테고리 만의 상태값을 1번의 내용처럼 router로 내려줬다.
나. state에 담아서 상태값 저장하기
상기 사진과 같이 router로 담긴 상태값을 write page에서 담고 container로 내려줘서 state에서 제어하도록 했다.
기존의 초기값을 props 내려준 값으로 지정해두고 전체게시판에서 글을 썼을 경우에만 바꿀 수 있도록 설정했다.
전체게시판 상태값은 community라고 따로 지정해서 내려줬다
상태값을 선택하였을 경우 상태값에 따라 다음과 같이 api가 실행되도록 만들어주었다.
또한 게시글에 대한 답글 까지 한 컴포넌트를 통해서 모두 create 될 수 있도록 만들었다.
